TailwindCSS psuedo classes stop working after adding this

[fayazara]

I tried adding this to my nuxt project along with Tailwindcss, the dark mode selectors were working fine, but default tailwind psuedo selectors like hover, focus etc stopped working.

Any idea how to fix this?

Here is a demo -https://github.com/fayazara/tailwind-nuxt-darkmode
Here is the git repo - https://github.com/fayazara/tailwind-nuxt-darkmode

[bdrtsky]

Hey!

You have this:

variants: {
    backgroundColor: ['dark', 'dark-hover', 'dark-group-hover', 'dark-even', 'dark-odd'],
    borderColor: ['dark', 'dark-focus', 'dark-focus-within'],
    textColor: ['dark', 'dark-hover', 'dark-active']
},

While Tailwind docs says: "It's important to note that your array of variants is not merged with the defaults, so if you'd like to enable another variant for a utility, you need to repeat the default variants for that utility as well." https://tailwindcss.com/docs/configuring-variants/#app

Try to add hover states as well. Should work.

[fayazara]

Worked, thanks!