CSS File
$dark-mode: false!default;
$primary-dark: blue;
[dark-mode='dark'] {
background: gray!important;
$dark-mode: true!global;
}
[dark-mode='light'] {
background: yellow!important;
$dark-mode: false!global;
}
@if $dark-mode==true{
$primary-dark: black!global;
} @else{
$primary-dark: blue!global;
}
HTML
<html>
<body dark-mode="dark">
</body>
</html>
The code provided above always sets the $dark-mode value as specified in the [dark-mode='light'] block while the background is set correctly.