I am trying to learn material ui. I want to enlarge the text field on my page. However, the styles i embed with the field changes height, width and other properties except the size. Following is my code:
const styles = {
container: {
display: 'flex',
flexWrap: 'wrap',
},
textField: {
// marginLeft: theme.spacing.unit,
// marginRight: theme.spacing.unit,
width: 300,
margin: 100,
fontSize: 50 //??? Doesnt work
}
}
Following is the stateless component(React):
const Searchbox = (props) => {
const { classes } = props;
return (
<TextField
onKeyDown={props.onKeyDown}
id="with-placeholder"
label="Add id"
placeholder="id"
className={classes.textField}
margin="normal"
autoFocus={true}
helperText={"Add an existing id or select "}
/>
);
};
export default withStyles(styles)(Searchbox);
I totally understand there is no rocket science as its a straightforward CSS in JS approach of applying styles.
However, I cannot override the base font size for my text field. Any help will be appreciated
question from:
https://stackoverflow.com/questions/50319847/cannot-change-font-size-of-text-field-in-material-ui 与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…