How to use a Stylus variable in calc?
Asked Answered
Y

2

71

In Stylus, how do I use a variable in a calc expression?

For example, the following doesn't work (arrow-size being a variable):

arrow-size = 5px
left calc(50% - arrow-size)
Yolanthe answered 28/8, 2015 at 13:25 Comment(2)
Just in case you didn't know, Stylus lets you do the calculation directly: left (50% - arrow-size). But I guess there might be times when you want the actual calc to show upUnderproof
left (50% - arrow-size) becomes 45%, which isn't correct if you're mixing units like that.Evaevacuant
Y
115

In order to use a Stylus variable inside a calc expression, one must employ the string % operator:

arrow-size = 5px
left "calc(50% - %s)" % arrow-size
Yolanthe answered 28/8, 2015 at 13:25 Comment(0)
O
61

To use multiple variables (not just one) in calc (or with other functions), i use sprintf as you used, but with tuples:

arrow-size = 5px
measure = 50%
left "calc(%s - %s)" % (measure arrow-size)

Remember that interpolation in Stylus is supported through {} and it's used for other kind of interpolation. It's used to surround an expression, which then becomes part of a identifier, or a selector.

Ounce answered 19/12, 2015 at 18:11 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.