nextra
nextra copied to clipboard
Styling breaks when importing nextra stylesheet in an existing tailwind project
Hello,
I'm trying to integrate nextra docs into an existing nextjs tailwind project but importing the nextra stylesheet breaks/override some of the styles throughout the project. Removing the stylesheet seems to fix the issue but that's not really going to work for the docs.
I've tried copying all the styles from here into a new stylesheet but importing that doesn't seem to work as well.
This is what I see when I copy all the styles from the above link and import it

These styles get overridden when importing nextra-theme-docs/style.css

Is there anyway to fix this? Appreciate any help! Thanks!
Yeah there's some unscoped styles in the docs theme, ideally all docs theme work should be scoped to the specific docs work so that if you use this in an existing app it doesn't wreck all the other styles.
I am facing the same
@bhatvikrant you can use my pr and fix the issue then copy paste the generated styles instead of the modules CSS export
https://github.com/shuding/nextra/issues/492#issuecomment-1205884261