При создании темы для цветов с помощью Material-UI я установил контрастный текст на белый (#fff).Он работает для кнопки с основным цветом, но не с дополнительным.
Пробные переопределения, как описано здесь: Материал интерфейса: невозможно изменить цвет текста кнопки в теме .Если переопределение решит это, то мне нужна помощь в написании одного.
const colortheme = createMuiTheme({
palette: {
primary: { main: '#e91e63' },
secondary: { main: '#03a9f4' },
contrastText: '#fff',
}
});
Ожидается, что обе кнопки будут иметь белый текст.Вместо этого получилась одна кнопка черного цвета:
![enter image description here](https://i.stack.imgur.com/YovT3.png)
Редактировать: я создал тему и отобразил компонент SimpleModal пользовательского интерфейса материала на родительском элементе, передав тему теме дочернему элементу.Кнопка отображается на дочернем элементе.
parent:
const blues = createMuiTheme({
palette: {
primary: { main: '#00e5ff' },
secondary: { main: '#2979ff' },
contrastText: '#fff'
}
})
<SimpleModal label="content" theme={blues} color="primary" document="content" />
child:
<div>
<MuiThemeProvider theme={this.props.theme}>
<Button className={classes.margin} variant="contained" color={this.props.color} onClick={this.handleOpen}>{this.props.label}</Button>
</MuiThemeProvider>
<Modal open={this.state.open} onClose={this.handleClose}>
<div style={getModalStyle()} className={classes.paper}>
<Typography variant="h6" id="modal-title">{this.state.reference}</Typography>
<Typography variant="subtitle1" id="simple-modal-description">{this.state.content}</Typography>
</div>
</Modal>
</div>