Skip to content

Instantly share code, notes, and snippets.

@jensgro
Last active August 29, 2015 13:56
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 jensgro/8974341 to your computer and use it in GitHub Desktop.
Save jensgro/8974341 to your computer and use it in GitHub Desktop.
Simple list-usage in Sass: color-list
.color-list li:nth-child(1) {
background-color: #cecece;
}
.color-list li:nth-child(2) {
background-color: #656565;
}
.color-list li:nth-child(3) {
background-color: #5f5f5f;
}
.color-list li:nth-child(4) {
background-color: #f6f6f6;
}
// ----
// Sass (v3.3.0.rc.3)
// Compass (v1.0.0.alpha.18)
// ----
$col1: #cecece;
$col2: #656565;
$col3: #5f5f5f;
$col4: #f6f6f6;
// add colour to each piece.
$colors-list: $col1 $col2 $col3 $col4;
@each $current-color in $colors-list {
$i: index($colors-list, $current-color);
.color-list li:nth-child(#{$i}) {
background-color: $current-color;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment