css - Issues creating transform mixin -
i'm trying yo create mixing css transform rule. tried following:
@mixin transform($action, $value) { -webkit-transform: $action($value); -ms-transform: $action($value); transform: $action($value); } ms ie9 webkit mobile devices transform rest caniuse
but output:
-webkit-transform: rotate 45deg; -ms-transform: rotate 45deg; transform: rotate 45deg; it seems brackets () not taken account structure. know how solve this?
you can this
@mixin transform($action) { -webkit-transform: $action; -ms-transform: $action; transform: $action; } and send in parameter ()
@include transform(rotate(45deg)) this produce
-webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); edit
solutions keeping 2 parameters
@mixin transform($action, $value) { -webkit-transform: $action + '(' + $value + ')'; -ms-transform: $action + '(' +$value + ')'; transform: $action + '(' + $value + ')'; } or
@mixin transform($action, $value) { -webkit-transform: $action + '(#{$value})'; -ms-transform: $action + '(#{$value})'; transform: $action + '(#{$value})'; }
Comments
Post a Comment