css - Parent Selector in Nested Stylus Mixins -
is there selector or available hack add together styles parents through mixin? need work in cases there nested set up. example, if have:
#overbox width 100vw height 100vh position fixed top 0 left 0 background-color rgba(90,90,90,.9) #contentbox width 480px height 320px background-color #e4e4e4
i have mixin vertically align element, so:
valign() position relative top 50% transform translatey(-50%)
which works i'd expect, add together tranform-style preserve-3d
parent element, #overbox, prevent border fuzziness, etc. i've had no success. looking work like:
valign() position relative top 50% transform translatey(-50%) &:parent transform-style preserve-3d
anyone know solution/workaround?
there no such feature based on actual stylus nesting tree, can mimic using selector()
bif modifying result:
pseudo-parent($depth = 1) $selectors = split(',', selector()) $selector, $i in $selectors $selector = split(' ', $selector) $selector = $selector[0..length($selector) - (1 + $depth)] $selectors[$i] = join(' ', $selector) homecoming '/' + join(',', $selectors) valign($depth = 1) position relative top 50% transform translatey(-50%) {pseudo-parent($depth)} transform-style preserve-3d
would thing you'd to. not “true” parent, part of selector without lastly simpleselector after space combinator, want go deeper, there optional $depth
argument.
css mixins stylus
No comments:
Post a Comment