CODEWITHSUNDEEP
stylus
Justin808
Justin808

Reputation: 21512

How to use a stylus variable in a selector

I would like to do something like this:

for $num in (1..100)
  :scope[md="$num"]
    width: $num + '%'

but it gives me this

:scope[md="$num"] {
  width: 1%;
}
:scope[md="$num"] {
  width: 2%;
}

How can I make $num be replaced in the selector as well?

Upvotes: 0

Views: 1168

Answers (1)

user4994625
user4994625

Reputation:

You have to use interpolation. In the comment Jcl has made a little mistake by not remove the quotes:

STYLUS

for $num in (1..100)
  :scope[md={$num}]
    width: $num + '%'

OUTPUT

:scope[md=1] {
  width: 1%;
}
:scope[md=2] {
  width: 2%;
}
:scope[md=3] {
  width: 3%;
}
...

If you want the output with quotes you can escape like this:

:scope[md=\"{$num}\"]

Upvotes: 2

Related Questions