Skip to content

Instantly share code, notes, and snippets.

@cfree
Created February 13, 2014 20:51
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 cfree/8983582 to your computer and use it in GitHub Desktop.
Save cfree/8983582 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
// ----
// Sass (v3.3.0.rc.3)
// Compass (v1.0.0.alpha.18)
// ----
// Mixins
@mixin icon($i) {
@if $i == form {
content: 'A';
}
@else if $i == people {
content: 'x';
}
}
@mixin icon-classes($icon, $collection: ()) {
.icon-#{$icon}-before {
&:before {
@include icon($icon);
@each $def in $collection {
@if length($def) == 2 {
#{nth($def,1)}: #{nth($def,2)};
}
}
}
}
.icon-#{$icon}-after {
&:after {
@include icon($icon);
@each $def in $collection {
@if length($def) == 2 {
#{nth($def,1)}: #{nth($def,2)};
}
}
}
}
}
// Create icon classes
@include icon-classes(form);
@include icon-classes(people, (margin-right 27px, background-image url('aol.com'), padding, text-shadow '1px 1px 1px #000'));
.icon-form-before:before {
content: 'A';
}
.icon-form-after:after {
content: 'A';
}
.icon-people-before:before {
content: 'x';
margin-right: 27px;
background-image: url("aol.com");
text-shadow: 1px 1px 1px #000;
}
.icon-people-after:after {
content: 'x';
margin-right: 27px;
background-image: url("aol.com");
text-shadow: 1px 1px 1px #000;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment