Skip to content

Instantly share code, notes, and snippets.

View jlittlejohn's full-sized avatar

Josh Littlejohn jlittlejohn

View GitHub Profile
@jlittlejohn
jlittlejohn / gist:4084248
Created November 16, 2012 04:58
SCSS: Opacity (Mixin)
@mixin opacity($opacity) {
opacity: $opacity;
filter: alpha(opacity=#{$opacity * 100});
}
@jlittlejohn
jlittlejohn / gist:4084254
Created November 16, 2012 04:59
SCSS: Content Columns (Mixin)
@mixin content-columns($columnCount, $columnGap: $gridGutterWidth) {
-webkit-column-count: $columnCount;
-moz-column-count: $columnCount;
column-count: $columnCount;
-webkit-column-gap: $columnGap;
-moz-column-gap: $columnGap;
column-gap: $columnGap;
}
@jlittlejohn
jlittlejohn / gist:4084266
Created November 16, 2012 05:01
SCSS: Box Shadow (Mixin)
@mixin box-shadow($shadow) {
-webkit-box-shadow: $shadow;
-moz-box-shadow: $shadow;
box-shadow: $shadow;
}
@jlittlejohn
jlittlejohn / gist:4084268
Created November 16, 2012 05:01
SCSS: Transitions (Mixin)
@mixin transition($transition) {
-webkit-transition: $transition;
-moz-transition: $transition;
-o-transition: $transition;
transition: $transition;
}
@jlittlejohn
jlittlejohn / gist:4084269
Created November 16, 2012 05:02
SCSS: Rotate (Mixin)
@mixin rotate($degrees) {
-webkit-transform: rotate($degrees);
-moz-transform: rotate($degrees);
-ms-transform: rotate($degrees);
-o-transform: rotate($degrees);
transform: rotate($degrees);
}
@jlittlejohn
jlittlejohn / gist:4084272
Created November 16, 2012 05:02
SCSS: Scale (Mixin)
@mixin scale($ratio) {
-webkit-transform: scale($ratio);
-moz-transform: scale($ratio);
-ms-transform: scale($ratio);
-o-transform: scale($ratio);
transform: scale($ratio);
}
@jlittlejohn
jlittlejohn / gist:4084275
Created November 16, 2012 05:03
SCSS: Translate (Mixin)
@mixin translate($x, $y) {
-webkit-transform: translate($x, $y);
-moz-transform: translate($x, $y);
-ms-transform: translate($x, $y);
-o-transform: translate($x, $y);
transform: translate($x, $y);
}
@jlittlejohn
jlittlejohn / gist:4084282
Created November 16, 2012 05:03
SCSS: Skew (Mixin)
@mixin skew($x, $y) {
-webkit-transform: skew($x, $y);
-moz-transform: skew($x, $y);
-ms-transform: skew($x, $y);
-o-transform: skew($x, $y);
transform: skew($x, $y);
}
@jlittlejohn
jlittlejohn / gist:4084291
Created November 16, 2012 05:04
SCSS: Translate3d (Mixin)
@mixin translate3d($x, $y, $z) {
-webkit-transform: translate3d($x, $y, $z);
-moz-transform: translate3d($x, $y, $z);
-o-transform: translate3d($x, $y, $z);
transform: translate3d($x, $y, $z);
}
@jlittlejohn
jlittlejohn / gist:4084301
Created November 16, 2012 05:07
SCSS: Border Radius (Mixin)
@mixin border-radius($radius) {
-webkit-border-radius: $radius;
-moz-border-radius: $radius;
border-radius: $radius;
}