2

I have created a mixin in SASS and the codes as below.

@mixin skew($axis, $a) {
  transform: skew+$axis+($a);
  -o-transform: skew+$axis+($a);
  -moz-transform: skew+$axis+($a);
  -webkit-transform: skew+$axis+($a);
}

But the output it shows as

transform:skewY-4deg;
-o-transform:skewY-4deg;
-moz-transform:skewY-4deg;
-webkit-transform:skewY-4deg

I want to add parentheses around -4deg i.e. transform: skewY(-4deg)

Can someone correct it?

1 Answers1

1

try this:

@mixin skew($axis, $a) {
  transform: skew+$axis+"("+$a+")";
  -o-transform: skew+$axis+"("+$a+")";
  -moz-transform: skew+$axis+"("+$a+")";
  -webkit-transform: skew+$axis+"("+$a+")";
}
warch
  • 2,387
  • 2
  • 26
  • 43
  • thanks Warch for the answer. Please correct the ans i.e. remove "+" plus sign between $axis and # `skew+$axis#{'('}$a#{')'};` –  Apr 26 '18 at 06:50
  • the other answer added spaces to the result... my solution now works better – warch Apr 26 '18 at 06:53
  • Yes @Warch the corrected ans is working perfectly. Thanks. –  Apr 26 '18 at 06:54
  • My rank is too low dear. So I can't up vote. I have accepted this answer as a correct answer. –  Apr 26 '18 at 13:50