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