Based on some simple SASS logic, I am trying to generate a list or color map dynamically. First with a static list:
$mypalette: (
'jungle': $color-green,
'sky': $color-blue,
'sunset': $color-orange,
'saddle': $color-saddle,
'gold': $color-gold,
'ivory': $color-ivory,
'olive': $color-olive
);
Next, I want to dynamically add colors to this map:
$n : 'newcolor';
$v :
$mypalette: append($mypalette, ($n $v));
@each $color in $mypalette {
@debug $color;
}
As you can see, the name and value of the new element is dynamic, stored in a variable. Most likely it works. The debug output shows the correct addition of the new value:
DEBUG: sunset # ff9800
DEBUG: saddle # 8b4513
DEBUG: gold # ffd700
DEBUG: ivory # fffff0
DEBUG: olive # 808000
DEBUG: newcolor #ffffff
The very last part is to actually use the value from the list:
html {
background: map-get($mypalette, 'ivory') !important;
}
, :
> error src/scss/main.scss (Line 401 of src/scss/_theme.scss: $map:
> (("jungle" #bbd910), ("sky" #2196f3), ("sunset" #ff9800), ("saddle"
> #8b4513), ("gold" #ffd700), ("ivory" #fffff0), ("olive" #808000), ("newcolor" #ffffff)) is not a map for `map-get')
, , , . , , , ?