Цель
Создание различных тем CSS для сайта с помощью node-sass, каждая тема в виде отдельного файла CSS.
Реализация (?)
Моя цель - иметь один файл _themes.scss
, который содержит всю информацию / переменные, относящиеся к теме, в карте sass, скажем:
$themes: (
theme-one: (
accentColor: orange,
backgroundColor: silver,
),
theme-two: (
accentColor: lime,
backgroundColor: black,
),
);
У меня нет проблем с наличием файла scss темы для каждой темы в моей карте sass:
├── _themes.scss
├── _common.scss
├── theme-one.scss
│ ├── @import _common.scss
│ └── @import _themes.scss
└── theme-two.scss
├── @import _common.scss
└── @import _themes.scss
и @importing моей карты темы в каждом из этих файлов.
Проблема
Но как мне "активировать" правильный ключ карты темы в каждом файле темы, чтобы использовать имена переменных (например, accentColor
в _main.scss
)?
Я не знаю, является ли это разумным подходом для решения проблемы создания разных файлов тем из одной sass-карты.Я мог бы установить переменные темы в каждом из файлов темы напрямую, но мне нравится идея объединить их в один файл (здесь: _themes.scss
).
Я нашел различные решения, но некоторые были слишком сложными (для меня) или они не выводили отдельные CSS-файлы.