Posts

Showing posts with the label material-ui

Material-UI ExpansionPanelSummary expanded class

Material-UI ExpansionPanelSummary expanded class In the documentation for Material-UI ExpansionPanelSummary there are several class override names where expanded is one of them. Could someone explain why it is not possible to use the following code to set the size of the root as well as expanded state? <ExpansionPanelSummary classes={{ root: { midWidth: 30}, expanded: { minWidth: 30} }}> foo bar </ExpansionPanelSummary> 1 Answer 1 you need to follow the styles overriding methods as the material-ui suggested. please find methods from here: https://material-ui.com/customization/overrides/ here I used classes overriding using withStyles from material ui const styles = theme => ({ root: { minWidth: 300 }, heading: { fontSize: theme.typography.pxToRem(15), fontWeight: theme.typography.fontWeightRegular }, expanded: { minWidth: 30, backgroundColor: "red" }...

Material-UI Disabled attribute not working

Material-UI Disabled attribute not working I'm trying to disable the edit button once i click on complete but it is not working. I have passed in the state in disabled attribute but it seems not doing anything, don't know maybe because of setState's asynchronous nature. I passed callback while calling setState method and it seems logging data randomly, Can someone suggest what should be done ? class App extends Component { state = { buttons: { id: "test" } }; handleCheckBox = id => { let buttons = Object.assign({}, this.state.buttons); buttons.id = !this.state.buttons[id] this.setState({buttons}, ()=>console.log(this.state.buttons)); } render() { return ( <div> {todos.map(todo => ( <List key={todo.id}> <ListItem ...