Warum funktioniert dark-light-choose() möglicherweise nicht?

Unterstützung
2

Ich vermute, dass aufgrund der Art und Weise, wie SCSS kompiliert wird, benutzerdefinierte Dark/Light-Definitionen zu color_definitions.scss innerhalb eines Themes hinzugefügt werden müssen und in anderen SCSS-Dateien nicht funktionieren werden.

Screen Shot 2020-12-04 at 9.54.13 PM
Screen Shot 2020-12-04 at 9.54.13 PM936×138 14.1 KB

color_definitions.scss befindet sich hoch in der Kaskade (vor vielen der Standardstile), daher möchten Sie den Teil .modal.history-modal ins dort nicht hinzufügen. Stattdessen können Sie einfach die Farbdefinition selbst hinzufügen…

$dark-theme-ins: #acf2bd;
$light-theme-ins: #4da06d;

$ins: dark-light-choose($light-theme-ins, $dark-theme-ins);

:root {
  --custom-ins: #{$ins};
}

Und dann können Sie in common oder in einer der anderen Dateien Ihres Themes Folgendes tun:

.modal.history-modal {
    ins {
        background: var(--custom-ins);
    }
}