-
-
Notifications
You must be signed in to change notification settings - Fork 32.7k
Description
Tabs by default receive the MuiTab-textColorInherit class, which for some reason sets their opacity to .7. Honestly I don't know what I'm missing, it's not in the docs but nobody on the internet seems to have complained about this. I can't imagine why this was included except to discourage developers from using inherit, in which case shouldn't it just be removed, or at least an opt-in behavior instead of a default? It's been in the code for 3 years but I can't wrap my mind around the decision here. At risk of stating the obvious, I expected that Tabs using inherited colors would be colored with the colors they inherited, and not mixed with 30% of the colors behind them. I'm forced to add an opacity rule to my theme for tabs if I want the obvious behavior, and figure out on my own why the colors are wrong given that it doesn't appear to be documented.
What you need to put in your theme overrides to fix this in case other people find this:
const theme = createMuiTheme({
overrides: {
MuiTab: {
textColorInherit: {
opacity: 1,
},
},
},
});