Is there a way I can compress this down a bit more so all I have to add in this line is:
background: linear-gradient(left, $rainbow-colors);
Will I have to nest something here?
@mixin rainbow($colors...) {
@each $color in $colors {
.#{$color} {
background: $color;
}
}
}
$rainbow-red: red;
$rainbow-orange: orange;
$rainbow-yellow: yellow;
$rainbow-green: green;
$rainbow-blue: blue;
body {
background: -webkit-linear-gradient(left, $rainbow-red, $rainbow-orange, $rainbow-yellow, $rainbow-green, $rainbow-blue);
}