Not worked with 'dark' or 'light' class on html attribute

[Xezard]

If you set the theme class ('dark' or 'light') to the html attribute, then the theme is not applied. At the same time, when setting the class to the body attribute, everything works as expected. Due to this problem, the plugin does not work correctly in the nuxt + nuxt-color-mode bundle, since nuxt-color-mode sets the theme class to the html attribute.

Upd: This is due to the fact that the html contains :root with theme variables declared. These variables overwrite variables that are in the class of the selected theme (dark, for example), because of this, changing themes does not work.

[Dunqing]

Thanks for the feedback, I don't know what nuxt + nuxt-color-mode did, I guess you can set selectors option to avoid :root override .dark

Just like this: selectors { dark: 'html.dark' }

[Xezard]

Thanks for the feedback, I don't know what nuxt + nuxt-color-mode did, I guess you can set selectors option to avoid :root override .dark

Just like this: selectors { dark: 'html.dark' }

In this configuration, everything began to work exactly as I expected. Thank you so much for your answer!