We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
i have the basic nextra theme, with light and dark mode, i added tailwind css but in the styles i want to add
@tailwind base; @tailwind components; @tailwind utilities; ::selection { @apply bg-pink-400 dark:bg-cyan-300 }
but the dark dose not work ?
Or how do i just apply slightly different styles depending on the theme ?
The text was updated successfully, but these errors were encountered:
@shuding
Sorry, something went wrong.
i also tried with plain css
[data-theme='dark'] ::selection { background-color: pink; } [data-theme='light'] ::selection { background-color: pink; }
@B2o5T
Found a solution i think
Tailwind config
/** @type {import('tailwindcss').Config} */ module.exports = { prefix: "nx-", darkMode: ["class", 'html[class~="dark"]'], content: [ "./components/**/*.{ts,tsx}", "./pages/**/*.{md,mdx}", "./theme.config.tsx", ], };
then _app.mdx
_app.mdx
import '../global.css' export default function App({ Component, pageProps }) { return ( <div className="selection:nx-bg-pink-400 dark:selection:nx-bg-slate-100"> <Component {...pageProps} /> </div> ) }
seems to work
No branches or pull requests
i have the basic nextra theme, with light and dark mode, i added tailwind css but in the styles i want to add
but the dark dose not work ?
Or how do i just apply slightly different styles depending on the theme ?
The text was updated successfully, but these errors were encountered: