For a project, I had to compile SCSS code to CSS. Everything seemed to work, except for a @for loop similar to this :
$base-color: #036;
@for $i from 1 through 3 {
ul:nth-child(3n + #{$i}) {
background-color: lighten($base-color, $i * 5%);
}
}
This loop hasn’t been compiled at all to CSS, as CSS does not loop though selectors. But is there a way to loop this code with JavaScript ?
How are you compiling?
Basically I entered all my scss code in this site : https://wtools.io/convert-scss-to-css
I just did a really silly loop (I’m on my phone) and it seemed to work.
@for $t from 1 through 2 { .a-#{$t} { color: red; } }