How do I write this in SCSS

Question

I'm not very familiar with SCSS and downt know how the following code should look in SCSS. I wanna add per level 20px margin.

.level-1 {
    margin-left: 0px;
}

...

.level-9 {
    margin-left: 160px;
}

Answer 1

You can use a for loop :

@for $i from 1 through 9 {
    .level-#{$i} {
        margin-left: 20px * ($i - 1);
    }
}