Skip to content

Instantly share code, notes, and snippets.

@mbreit
Last active August 29, 2015 14:21
Show Gist options
  • Save mbreit/b24fc894cd52eb9eb9d1 to your computer and use it in GitHub Desktop.
Save mbreit/b24fc894cd52eb9eb9d1 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
// ----
// Sass (v3.4.13)
// Compass (v1.0.3)
// ----
$green: #00FF00;
@mixin fa-icon {
}
@mixin frontpage-widget($nr, $color, $icon) {
&:nth-child(#{$nr}) {
h3 {
color: $color;
&:before {
@include fa-icon();
content: $icon;
width: (18em / 14);
}
}
.more {
background-color: $color;
}
}
}
.widget {
@include frontpage-widget(1, #00B5CC, "\f086");
@include frontpage-widget(2, $green, "\f007");
@include frontpage-widget(3, #CC181E, "\f16a");
}
@charset "UTF-8";
.widget:nth-child(1) h3 {
color: #00B5CC;
}
.widget:nth-child(1) h3:before {
content: "";
width: 1.28571em;
}
.widget:nth-child(1) .more {
background-color: #00B5CC;
}
.widget:nth-child(2) h3 {
color: #00FF00;
}
.widget:nth-child(2) h3:before {
content: "";
width: 1.28571em;
}
.widget:nth-child(2) .more {
background-color: #00FF00;
}
.widget:nth-child(3) h3 {
color: #CC181E;
}
.widget:nth-child(3) h3:before {
content: "";
width: 1.28571em;
}
.widget:nth-child(3) .more {
background-color: #CC181E;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment