Kevin Fox comments

Results 6 comments of


                                            Kevin Fox

Emotion Global component styles unexpectedly overridden by MUI styles (Next.js, TypeScript, Emotion Engine)

I worked around this issue by moving/converting all of our old MUI global overrides from a Emotion Global template literal style CSS block (was previously a styled-components Global template literal...

Emotion Global component styles unexpectedly overridden by MUI styles (Next.js, TypeScript, Emotion Engine)

Thank you for checking it out. Is `` still a legit solution? For some reason I got the sense it was retired solution. I may have gotten confused though. So...

Emotion Global component styles unexpectedly overridden by MUI styles (Next.js, TypeScript, Emotion Engine)

I tracked back my confusion around these two.... `@mui/styles/` vs `@mui/material/styles` It's still not crystal clear to me what is and isn't deprecated. I just stumbled upon this code comment...

Using emotion with Next.js. :first-child selector gives me an error: The pseudo class ":first-child" is potentially unsafe when doing server-side rendering. Try changing it to ":first-of-type".

We are currently using Emotion + MUI5 + Next.js. I did a bunch of research to see why this warning exists. I read a bunch of Github threads, collecting more...

Using emotion with Next.js. :first-child selector gives me an error: The pseudo class ":first-child" is potentially unsafe when doing server-side rendering. Try changing it to ":first-of-type".

If you feel comfortable suppressing the error you can add this one line.... ``` const createEmotionCache = (): EmotionCache => { let insertionPoint; if (isBrowser) { const emotionInsertionPoint = document.querySelector(...

[material-pigment-css] Grid throws an error when it is RSC

You are onto something. Thank you for replying. Doing the following swap out in `/src/app/page.tsx` ...makes it work again. ``` //import Grid from '@mui/material-pigment-css/Grid'; import Grid from '@mui/material/Grid2'; ```