Skip to content

Instantly share code, notes, and snippets.

@ghosh
Created March 9, 2014 21:06
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ghosh/9454564 to your computer and use it in GitHub Desktop.
Save ghosh/9454564 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
// ----
// Sass (v3.3.0.rc.5)
// Compass (v1.0.0.alpha.18)
// ----
// Prefixing mixin
// ----------
// @param [map] $map: property/value pairs to be prefixed
// @param [list] $vendors: vendor prefixes to use
// ----------
@mixin prefix($map, $vendors: "webkit") {
// Loop through properties
@each $prop, $value in $map {
// If $vendors is not false
@if $vendors {
// Loop through vendors to dump prefixed property
@each $vendor in $vendors {
#{"-" + $vendor + "-" + $prop}: #{$value};
}
}
// Dump regular property anyway
#{$prop}: #{$value};
}
}
.default-prefix {
@include prefix((
transform: rotate(42deg)
));
}
.multiple-properties {
@include prefix((
transform: rotate(42deg),
perspective: 1337
));
}
.moar-prefixes {
@include prefix((
transform: rotate(42deg)
), "webkit" "moz");
}
.no-prefix {
@include prefix((
transform: rotate(42deg)
), false);
}
.default-prefix {
-webkit-transform: rotate(42deg);
transform: rotate(42deg);
}
.multiple-properties {
-webkit-transform: rotate(42deg);
transform: rotate(42deg);
-webkit-perspective: 1337;
perspective: 1337;
}
.moar-prefixes {
-webkit-transform: rotate(42deg);
-moz-transform: rotate(42deg);
transform: rotate(42deg);
}
.no-prefix {
transform: rotate(42deg);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment