Open UmbrellaCrow612 opened 1 year ago
@shuding
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
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
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 ?