Skip to content

Instantly share code, notes, and snippets.

@joemay
Forked from nathos/sass-hash-mixin.sass
Created October 3, 2013 23:16
Show Gist options
  • Save joemay/6818566 to your computer and use it in GitHub Desktop.
Save joemay/6818566 to your computer and use it in GitHub Desktop.
@mixin category-colors($after: false)
@each $category in $categories
@if $after == true
.cat-#{nth($category, 1)}:after
background-color: nth($category, 2)
@else
.cat-#{nth($category, 1)}
background-color: nth($category, 2)
// Categories & Category Colors
// this is a comma-separated list of space-separated lists!
$categories: site teal, youth orange, poetry plum, fiction salmon, creativewriting steelblue
// The placeholder selector we'll be @extending -- placeholder selectors require Sass 3.2
%category-colors
@include category-colors
.category-banners
li
// @extend the color classes into the list items
@extend %category-colors
/* Note that the placeholder class isn't output in the CSS */
.category-banners li .cat-site {
background-color: teal;
}
.category-banners li .cat-youth {
background-color: orange;
}
.category-banners li .cat-poetry {
background-color: plum;
}
.category-banners li .cat-fiction {
background-color: salmon;
}
.category-banners li .cat-creativewriting {
background-color: steelblue;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment