Skip to content

Instantly share code, notes, and snippets.

@shaunbent
Created September 2, 2015 06:39
Show Gist options
  • Save shaunbent/be1431bc1f3b31c1a6f3 to your computer and use it in GitHub Desktop.
Save shaunbent/be1431bc1f3b31c1a6f3 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
// ----
// Sass (v3.4.14)
// Compass (v1.0.3)
// ----
// Colour them
$sport-yellow: #ffdf43;
$news-red: #bb1919;
$iplayer-pink: #f54997;
$live-blue: #1169f6;
$gel-orange: #e4712a;
// Map them
$products: (
'sport': $sport-yellow,
'news': $news-red,
'iplayer': $iplayer-pink,
'live': $live-blue,
'gel': $gel-orange
);
// Loop them
@each $product-name, $product-colour in $products {
.button--#{$product-name} {
background-color: $product-colour;
}
}
.button--sport {
background-color: #ffdf43;
}
.button--news {
background-color: #bb1919;
}
.button--iplayer {
background-color: #f54997;
}
.button--live {
background-color: #1169f6;
}
.button--gel {
background-color: #e4712a;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment