Ряд свойств в качестве значения карты

Question

Может ли карта SCSS каким-либо образом сопоставить ключ с произвольной строкой свойств CSS, что-то вроде этого (но это не работает):

$formats: (
  1: "color: red; font-size: large",
  2: "color: blue; font-weight: bold; text-align: center"
)

Answer 1

Не думайте, что это возможно с предоставленным вами синтаксисом.Но что-то вроде этого может помочь вам?

$map: (
  foo: (
    color: .red,
    font-size: large
  ), 
  bar: (
    color: blue,
    font-weight: bold,
    text-align: center;
  )
);

@mixin print-styles($map){
 @each $property, $value in $map {
   #{$property}: $value;
 }
}

.foo {
 @include print-styles(map-get($map, foo));
}

.bar {
 @include print-styles(map-get($map, bar));
}