Question

Following code

for $i in (1..81)
   .block:nth-child({$i})
      transition transform 500ms ease $i\s

will be compiled to

.block:nth-child(1) {
    transition: transform 500ms ease 1 s;
}

......

But that space between number and seconds is redundant!

How can I remove it?

Was it helpful?

Solution

One possible approach:

for $i in (1..81)
   .block:nth-child({$i})
     transition transform 500ms ease 1s * $i

That's actually quite similar to the example given in Selector Interpolation section of Stylus documentation.

OTHER TIPS

You can use the unit() function:

for $i in (1..81)
  .block:nth-child({$i})
    transition transform 500ms ease unit($i, 's')
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top