Html 如何使用mixin在scs中应用多重变换？

如何使用mixin在SCS中应用多个变换？我想在按钮中平移和旋转变换。我使用mixin进行转换

@mixin transition（$transition…）{
/*定义前缀以便我们可以在下面的mixin中使用它们*/
$前缀：（“-webkit”、“-ms”、“-o”、”）；
@$prefixes中的每个$prefixes{
#{$prefix}-transition:$transition；
}
过渡：过渡；
}
@混合变换（$transforms）{
-moz变换：$transforms；
-o-变换：变换；
-ms变换：$transforms；
-webkit转换：$transforms；
转换：$transforms；
}
//翻译
@混音翻译（$x，$y）{
@包括变换（平移（$x，$y））；
}
//轮换
@混合旋转（$deg）{
@包括变换（旋转（#{$deg}deg））；
}
.btn{
边框：2倍纯绿；；
边界半径：2px；
颜色：绿色；
光标：指针；
字体大小：15px；
显示：内联块；
字母间距：0.1米；
最小宽度：130px；
填充：10px 20px；
位置：相对位置；
文本对齐：文本中心；
文本转换：大写；
@包括过渡（所有0.5秒到0秒）；
溢出：隐藏；
&：之后{
背景：绿色；
内容：“；
身高：0；
左：50%；
不透明度：0；
位置：绝对位置；
最高：50%；
宽度：100%；
z指数：-1；
-webkit变换：translateX（-50%）translateY（-50%）旋转（45度）；
-moz变换：translateX（-50%）translateY（-50%）旋转（45度）；
-ms变换：translateX（-50%）translateY（-50%）旋转（45度）；
变换：translateX（-50%）translateY（-50%）旋转（45度）；
@包括转换（所有0.3秒到0秒）；
}
&：悬停{
颜色：#fff；
&：之后{
身高：260%；
不透明度：1；
}
}
}

---

按钮

为了简单起见，而不是编写此

-webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
-moz-transform: translateX(-50%) translateY(-50%) rotate(45deg);
-ms-transform: translateX(-50%) translateY(-50%) rotate(45deg);
transform: translateX(-50%) translateY(-50%) rotate(45deg);

直接使用声明的mixin

@include transform(translateX(-50%) translateY(-50%) rotate(45deg));