[Error] index.js:1446 Warning: Material-UI: you are using the deprecated typography variants that will be removed in the next major release.
Please read the migration guide under https://material-ui.com/style/typography#migration-to-typography-v2
[Reference-Url] https://material-ui.com/style/typography/#migration-to-typography-v2
[Error]
Warning: Material-UI: the `MuiListItem` component increases the CSS specificity of the `selected` internal state.
You can not override it like this:
{
"button": {
"&:hover, &:focus": {
"backgroundColor": "#F3F5FF"
}
},
"selected": {
"backgroundColor": "#F3F5FF !important",
"&:focus": {
"backgroundColor": "#F3F5FF"
}
}
}
Instead, you need to use the $ruleName syntax:
{
"&$selected": {
"backgroundColor": "#F3F5FF !important",
"&:focus": {
"backgroundColor": "#F3F5FF"
}
}
}
https://material-ui.com/customization/overrides#internal-states
[Reference-Url] https://material-ui.com/customization/overrides/#use-rulename-to-reference-a-local-rule-within-the-same-style-sheet
Error Screenshots
Screenshot After removing bug