Skip to content

Instantly share code, notes, and snippets.

@ryanallen
ryanallen / gist:10d04ec21da0d44d5577
Last active Aug 29, 2015
Variable arguments in a Sass mixin or function
View gist:10d04ec21da0d44d5577
@mixin corners($corner...) {
border-radius: $corner;
}
.round-corners {@include corners(1rem 1em 1vw 1vmin);}
/// compiles to:
///
/// .round-corners {border-radius: 1rem 1em 1vw 1vmin;}
/// official docs: http://sass-lang.com/documentation/file.SASS_REFERENCE.html#variable_arguments
@ryanallen
ryanallen / gist:b6efa3f4ff016f1ae4e7
Created Dec 28, 2014
Nesting Properties in SCSS
View gist:b6efa3f4ff016f1ae4e7
.scene__adventure {
@include scene;
background: { /// : needs to replace the - for nested properties
color: $blue20;
image: url(#{$svg-path}space-adventure__stars.svg);
}
}
View Sass-Doesnt-Care.markdown
@ryanallen
ryanallen / gist:0b607bc5d92b150aa279
Created Dec 22, 2014
Stay DRY by setting your SCSS image path locations as a variable.
View gist:0b607bc5d92b150aa279
$svg-path : "../../img/svg/";
body {
background: url(#{$svg-path}astronaut-ryan.svg) repeat-x fixed 0 0;
}
You can’t perform that action at this time.