Как правильно записать цикл в Stylus?

Question

[Максим]

Необходимо получить css вида

.class:nth-child(1) {
  background-position-y:0%;
}
.class:nth-child(2) {
  background-position-y:25%;
}
.class:nth-child(3) {
  background-position-y:50%;
}

В Stylus делаю так:

for n in (1..3)
 .class:nth-child(n)
  background-position-y (n - 1) * 25 \%

на выходе получаю это:

.class:nth-child(n) {
  background-position-y: 0 %;
}
.class:nth-child(n) {
  background-position-y: 25 %;
}
.class:nth-child(n) {
  background-position-y: 50 %;
}

в :nth-child() так и остается n, в чем ошибка?

Answer 1

[monochromer]

Нужно использовать интерполяцию переменных

for $n in (1..3)
	.class:nth-child({$n})
		background-position-y ($n - 1) * 25%