search

Evo-Forge / Essence

Essence - The Essential Material Design Framework
MIT License
415 stars 47 forks source link

Upper case everywhere :( #18

Closed hipertracker closed 9 years ago

hipertracker commented 9 years ago

Why almost all elements are affected by text-transform: uppercase? That's annoying that I can't even use <Text><Hello World!</Text> for displaying text as it is. To overcome that behaviour I have to wrap every text ...<span style={{textTransform: 'none'}}>Hello World!</span>... Is there any simple way to disable that behaviour by default?

hetmann commented 9 years ago

Hi @hipertracker

Can you check your CSS or LESS styles for any inherit text-transform props?! For example if you check the Text component https://github.com/PearlVentures/Essence/blob/master/src/js/components/Text.js by default it will return a <span> with no className.

Let us know what you find.

hipertracker commented 9 years ago

I think, there are two bugs over here. (1) AppBar enforce uppercase style on all it's children. (2) Text cannot override that with inline style. See:

 <AppBar>
    <span>Hello World is upper cased :(</span>
    <Text style={{textTransform:'none'}}>Still Upper Case :(</Text>
    <Text><span style={{textTransform:'none'}}>This Works correct!</span></Text>
</AppBar>
hetmann commented 9 years ago

AppBar: there was a text-transform: uppercase on all span tags, so I remove that from appbar.less