Sass использует разные цвета каждый раз при компиляции .cssCSS

Разбираемся в CSS
Ответить
Гость
 Sass использует разные цвета каждый раз при компиляции .css

Сообщение Гость »

Я пытаюсь создать две скомпилированные таблицы стилей из иерархии файлов .sass — каждая версия будет предоставлять разные цветовые версии веб-сайта (например, темную и светлую).
Я создал файл sass, который определяет цвета, которые будут использоваться для некоторых компонентов в качестве переменных, а затем они используются в других файлах .sass.
Я подумал, что я бы просто нужно найти способ определять разные значения в зависимости от того, какая темная или светлая версия скомпилированного CSS мне нужна.
Я считаю невозможным заставить .sass присваивать разные значения переменные во время компиляции.
Я новичок в Sass, поэтому, вероятно, неправильно подхожу к этой проблеме.
Моей последней идеей было определить собственный в верхнем файле «light.sass» и используйте оператор @if в файле theme.sass, чтобы соответствующим образом установить переменные.

Код: Выделить всё

light_version.sass
@use "abstracts"
@use "base"
@use "components"
@use "layout"
@use "pages"
@use "themes"
@use "vendors"

@function application_theme()
@return 'light'
А вversion.sass я бы определил цвета в зависимости от требуемой темы

Код: Выделить всё

versions.sass
@if application_theme() == 'light'
$anchor-text-colour: colours.$black

$default-background-colour: colours.$white
$default-text-colour: colours.$black
Согласно тому, что я читал о @if и @function, мне следует использовать { }, но когда я это делаю, он не может скомпилироваться с «ожидаемой новой строкой».
Как указано выше. при компиляции ошибка

Код: Выделить всё

Error: Undefined variable.
14:18:44 css.1  |   ╷
14:18:44 css.1  | 5 │   color: themes.$anchor-text-colour
14:18:44 css.1  |   │          ^^^^^^^^^^^^^^^^^^^^^^^^^^
но если я удалю отступ, он объявит переменную и не будет никаких ошибок.
Я не уверен, заключается ли проблема в том, что переменная не возвращается функцией, как ожидалось, или более вероятно, что на данном этапе функция находится вне области видимости, потому что, если я неправильно напишу имя функции, ошибка компиляции не вернется.

Подробнее здесь: https://stackoverflow.com/questions/781 ... s-compiled
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «CSS»