This is a part of AnyType’s source code related to dark mode:
If I use custom CSS to change a tag’s background color, I have to define the color variables in :root . And because of the way dark mode is implemented (isMultiSelect.tagColor-xxx will be overridden in html.themeDark ), I also have to redefine the same variables under html.themeDark , which results in redundant code.
In my view, the selector .isMultiSelect.tagColor-xxx should not be redeclared inside html.themeDark, because this leads to redundant code. Only the color variables and any dark-mode–specific things, such as dark-icons, need to be overridden within the dark-mode scope, while structural selectors like .isMultiSelect.tagColor-xxx should remain outside.
Regarding !important, is it actually necessary here? It makes custom CSS much less flexible.
I believe this implement is better, which is using CSS selectors to define themes:
This structure is far more flexible. It allows themes to be defined cleanly and makes it easy to add new themes or switch between them.