stylus css tutorial

¿Cómo usar una variable Stylus en calc?

Question

En Stylus, ¿cómo uso una variable en una expresión calc ?

Por ejemplo, lo siguiente no funciona ( arrow-size es una variable):

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

Answer 1

Para usar múltiples variables (no solo una) en calc (o con otras funciones), uso sprintf como lo usaste , pero con tuplas:

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

Recuerde que la interepolation en Stylus es compatible con {} y se usa para otro tipo de interpolación. Se utiliza para rodear una expresión, que luego se convierte en parte de un identificador o un selector.

Answer 2

Para utilizar una variable Stylus dentro de una expresión calc, se debe emplear el operador de cadena% :

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