The paper button is always uppercase

Question

I use the Paper-Button, but I ran into a problem that the button text always gets the title or regular case. I don't see any CSS or Javascript property being applied to make it uppercase. How to solve this problem.

Answer 1

As mentioned in the comments above, the material design specification for buttons indicates that the text should be uppercase, but you can easily override its CSS property:

paper-button { text-transform: none; } 

Answer 2

I had the same problem and solved the problem by setting the default theme. Add the following code to the file (name of your choice) .js

 import { createMuiTheme } from '@material-ui/core/styles'; const theme = createMuiTheme({ typography: { button: { textTransform: 'none' } } }); export default theme; 

Then you can add the file to your application in index.js. I called it theme.js:

 ... import theme from './theme'; ... const app = ( <ThemeProvider theme={theme}> <CssBaseline /> <App /> </ThemeProvider> ); ReactDOM.render(app, document.getElementById('root'));