Gibt es eine Möglichkeit, @if in einer Theme-Komponente mit einer Variablen zu verwenden?

Entwickler
1

Ich versuche, eine boolesche Theme-Einstellung zu verwenden, um zu bestimmen, ob ich einen bestimmten Stil anwenden kann:

@if var(--my-variable) {
   .my-selector {
      display: block;
  }
}

und anderswo in der eingebundenen Datei:

:root {
  --my-variable: #{$my_boolean_setting_in_theme};
}

aber das scheint nicht zu funktionieren …

Der Stil wird angewendet, unabhängig davon, ob die Variable true oder false ist.

2

Laufzeit-CSS-Variablen wie --my-variable können nicht in SASS/SCSS-Build-Zeit-@if-Anweisungen verwendet werden.

Daher denke ich, dass Sie dies vollständig zur Build-Zeit behandeln müssten und sich nur an SCSS-Variablen halten müssten. So etwas wie:

@if $my_boolean_setting_in_theme == "true" {
  ...
}
3

Danke David, ich habe alle möglichen Kombinationen ausprobiert, weiß nicht, warum ich nicht darauf gekommen bin, Prost!