Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

SASS - get map item value by item index

Tags:

sass

I want to be able to pick a SASS map item value by that map item's index.
Simplified scenario:

SCSS

// Colors map (MUST stay this way due to system dependence)
$colors: (
    a: red,
    b: green,
    c: blue
);

@for $i from 1 through 3{
    a:nth-child({$i}){ color:[GET COLOR BY $i FROM $COLORS]; }
}

Is that possible?

like image 589
vsync Avatar asked Nov 07 '16 15:11

vsync


1 Answers

gist demo

$colors: (
    a: red,
    b: green,
    c: blue
);

@each $color, $name in $colors{
  $i: index($colors, $color $name);
  a:nth-child(#{$i}){ color:$color; }
}
like image 169
vsync Avatar answered Nov 16 '22 11:11

vsync