В SASS есть ассоциативные массивы (карты). Штука безусловно полезная - была бы, если бы не уродский синтаксис использования:
map-get($map, $key)
Кому могло в голову взбрести такое, я не знаю. И ладно ещё, если у меня одномерный массив. А если двухмерный или не дай бог трех? Ну что-то наподобии:
$button-color: (
primary: (
normal: (
background: #0088cc,
text: #ffffff,
),
hover: (
background: #0077b3,
text: #ffffff,
),
),
default: (
// ...
),
);
// wtf?
background-color: map-get(map-get(map-get($button-color, 'primary'), 'hover'), 'background');
Ну можно, конечно, написать некую оберточную функцию или миксин. Но по-моему, это проблему не устранит, а только немного сгладит.
Реально удобнее просто наделать врукопашную батарею переменных:
$button-primary-normal-background: #0088cc;
$button-primary-normal-text: #ffffff;
$button-primary-hover-background: #0077b3;
$button-primary-hover-text: #ffffff;
// ...
И вообще я так и не смог найти ситуации, когда массив оказался бы удобнее просто набора переменных. Хотя в теории логично было бы использовать массивы для объединения однотипных сущностей. Скажем, для тех же брейкпойнтов в медиа-запросах.
Кажется, что массив окажется удобнее только в ситуации, когда количество значений заранее неизвестно - чтобы обходить их в цикле. А в вышеприведенном примере с кнопками - нафиг не нужны.
Возможно, я что-то недопонимаю и есть какие-то хорошие практики?