css - How to Generate Placeholders in Stylus -
i'm looking generate placeholders , variables can change depending on configured proportions such following:
$small-margin-top$large-margin-top$small-padding-bottom
where each placeholder applies corresponding, generated variable rule:
$small-margin-top margin-top $marginsmall $large-margin-top margin-top $marginlarge $small-padding-bottom margin-bottom $marginsmall i have statically defined variables now:
/* margin */ $margin = 1rem $marginsmall = $margin / $multiplier $marginlarge = $margin * $multiplierlarge $marginmini = $marginsmall / $multiplierlarge but error:
typeerror: expected "name" string, got ident:marginmini
properties = margin padding proportions = mini small medium large directions = top left bottom right property in properties proportion in proportions direction in directions ${property}-{direction}-{proportion} {property}-{direction} lookup(property + proportion) how can generate placeholders proportions variable, such generated placeholders may extended later (@extend $margin-large)?
edit: here working solution
the lookup bif accepts string, , passing ident (margin, padding, etc. without quotes). can convert them string using concatenation. also, miss $ sign:
properties = margin padding proportions = mini small medium large directions = top left bottom right property in properties proportion in proportions direction in directions ${proportion}-{property}-{direction} {property}-{direction} lookup('$' + property + proportion)
Comments
Post a Comment