Build solution that allows a global import in _app.js for NextJS that doesn't override Nextra docs styling

[cthg0d]

Issue:

• NextJS has an easy solution for global css by storing in /pages/_app.js, but if you override css imported in /pages/_app.js, Nextra docs will look awful. See https://nextjs.org/docs/pages/building-your-application/styling/css-modules#global-styles

Reproduce the issue:

• Make some Nextra docs in a NextJS project.
• Have a global css file in /pages (root) that is empty. Import this css file in /pages/_app.js. Nextra docs will look great.
• Edit the global css file in /pages (root) with all of your styles.
• Nextra docs look weird. In my case, everything was centered and had width restrictions.

Solution desired:

• For NextJS and Nextra combination, please allow NextJS to read the global stylesheet without affecting the styles of Nextra docs.
• See https://nextjs.org/docs/pages/building-your-application/styling/css-modules#global-styles for NextJS rules relating to _app.js.

[dimaMachina]

Please provide a reproduction

[cthg0d]

Please provide a reproduction

How to reproduce is the first half of my post. What do you mean?

[dimaMachina]

I mean providing reproduction repo

[textreme]

@cthg0d I agree there needs to be better documentation on how to do custom styling. I'm running into a similar issue - I can't get tailwindcss to work out of the box.