If I am using the following mixins to set elements' styles for light and dark modes:
@mixin light() {
@media (prefers-color-scheme: light) {
@at-root #{selector-nest(':root:not([data-theme=light]):not([data-theme=dark])', &)} {
@content;
}
}
@at-root #{selector-nest(':root[data-theme=light]', &)} {
@content;
}
}
@mixin dark() {
@media (prefers-color-scheme: dark) {
@at-root #{selector-nest(':root:not([data-theme=light]):not([data-theme=dark])', &)} {
@content;
}
}
@at-root #{selector-nest(':root[data-theme=dark]', &)} {
@content;
}
}
Is there a @function is-light-mode() that I can use within an if statement? (this is mainly because I want to set palette colors in the :root itself).