Question

Following SCSS snippet generates the appropriate CSS after using compass compile. But if I use -output_style compressed the CSS is missing the .box-yellow definition. .box-red etc. is generated but yellow is missing.

$colors: red #f00, yellow #ff0, green #0f0, blue #00f;

@each $entry in $colors {
    $name: nth($entry, 1);
    $color: nth($entry, 2);

    .box-#{$name} > header {
         background: $color;
    }
 }

Could this be a bug or am I missing something here?

Answer 1

Not sure if it’s a bug, but it seems odd to me. I can replicate that here with v 3.2.3 if I set the style to compressed. Oddly, shortening it to yello works fine. A workaround is to quote them:

$colors: "red" #f00, "yellow" #ff0, "green" #0f0, "blue" #00f;

That generates:

.box-red>header{background:red}.box-yellow>header{background:#ff0}.box-green>header{background:lime}.box-blue>header{background:blue}

And now that I look at the output again, a pattern emerges: The other colors generate a color name rather than a hex value.