_mixin-toolbox.scss

/**
 * Mixin Toolbox
 * Created by Esko Cruzeta
 * https://github.com/EskoCruz/sass-mixin-toolbox
 */

/*// box shadow */
/* offset-x | offset-y | blur-radius | spread-radius | color | inset */
@mixin box-shadow ($top, $left, $blur, $spread, $color, $inset: false) {
  @if $inset {
    -webkit-box-shadow:inset $top $left $blur $spread $color;
    -moz-box-shadow:inset $top $left $blur $spread $color;
    box-shadow:inset $top $left $blur $spread $color;
  } @else {
    -webkit-box-shadow: $top $left $blur $spread $color;
    -moz-box-shadow: $top $left $blur $spread $color;
    box-shadow: $top $left $blur $spread $color;
  }
}

/*// border radius */
@mixin border-radius ($radius) {
  -webkit-border-radius: $radius;
  -moz-border-radius: $radius;
  -ms-border-radius: $radius;
  border-radius: $radius;
}

/*// generic transform */
@mixin transform ($transforms) {
  -moz-transform: $transforms;
  -o-transform: $transforms;
  -ms-transform: $transforms;
  -webkit-transform: $transforms;
  transform: $transforms;
}
/*// scale */
@mixin scale ($scale) {
  @include transform(scale($scale));
}
/*// translate */
@mixin translate ($x, $y) {
  @include transform(translate($x, $y));
}
/*// skew */
@mixin skew ($x, $y) {
  @include transform(skew(#{$x}deg, #{$y}deg));
}
/*// rotate */
@mixin rotate ($deg) {
  @include transform(rotate(#{$deg}deg));
}
/*// rotateX */
@mixin rotateX ($deg) {
  @include transform(rotate(#{$deg}deg));
}
/*// rotateY */
@mixin rotateY ($deg) {
  @include transform(rotate(#{$deg}deg));
}
/*// rotateZ */
@mixin rotateZ ($deg) {
  @include transform(rotate(#{$deg}deg));
}
/*// rotate 3D */
@mixin rotateXYZ ($x, $y, $z) {
  @include transform(rotateX(#{$x}deg), rotateY(#{$y}deg), rotateZ(#{$z}deg));
}
/*// perspective */
@mixin perspective ($perspective) {
  @include transform(perspective($perspective));
}
@mixin perspective-rotateXYZ (){
  @include transform(perspective($perspective));
}
/*// transform origin */
@mixin transform-origin ($origin) {
  -moz-transform-origin: $origin;
  -o-transform-origin: $origin;
  -ms-transform-origin: $origin;
  -webkit-transform-origin: $origin;
  transform-origin: $origin;
}


/*// background linear gradient - top to bottom */
/* top | bottom */
@mixin background-grad($top, $bottom) {
  background: -webkit-linear-gradient($top, $bottom); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient($top, $bottom); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient($top, $bottom); /* For Firefox 3.6 to 15 */
  background: linear-gradient($top, $bottom); /* Standard syntax */
}