I need to ensure that all text in my muiv5 project is capitalized by default, unless specifically overridden using sx or individual component styling.
My attempted solution:
<ThemeProvider theme={theme}>
<IntlProvider
locale="en"
defaultLocale="en"
messages={AppLocale.en.messages}
>
<CssBaseline />
<GlobalStyles styles={{ root: { textTransform: "capitalize" } }} />
<Component {...pageProps} />
</IntlProvider>
</ThemeProvider>
Unfortunately, this method did not work for me. Is there a better way to achieve this? Even utilizing createTheme has not resolved the issue.
Important Note: I prefer not to utilize makeStyles. Working within Next.js platform.