Динамический вызов переменных в SCSS [дубликат]
This question already has an answer here:
Creating or referencing variables dynamically in Sass 5 answersУ меня есть ряд переменных цвета для моего сайта, которые нумеруются:
$red-1: #821B0D;
$red-2: #B13631;
$red-3: #D75B5B;
$red-4: #F18788;
$red-5: #FDB9B0;
Я хотел бы создать миксин, который будет вызывать их динамически, например:
@mixin link($color-name) {
color: $#{$color-name}-2;
&:hover {
color: white;
background-color: $#{$color-name}-4;
}
}
Однако я не могу понять, как вызывать переменные таким образом. (Вышеуказанный синтаксис не работает.)
(Чтобы избежать очевидного предположения: я не использую цветовые функции SASS, потому что мои цвета не задаются линейными изменениями насыщенности или яркости. Я не могу генерировать их программно в SASS. такой же, как тот, что между синим, который не такой же, как тот, что для зеленых и т. д.)