Sublime-CSS-Format
Sublime-CSS-Format copied to clipboard
Breaks interpolated variables
The expanded option turns an interpolated variable rule into new lines, presumably because it uses { & } brackets.
For example:
&.pt_#{$type}
Becomes:
&.pt_# {
$type
}
Which causes the SASS Compiler to fail.
Syntax error: Invalid CSS after " &.pt_#": expected id name, was " {"
An interpolated variable needs to remain on one line with no spaces.
It's also worth noting that it drops the opening { to the rule it classes onto another new line. Here's a full example, AFTER formatting. SASS will not compile this.
$card-types:disruptions, post, policies, forms;
@each $type in $card-types {
&.pt_# {
$type
}
{
@extend .pt_extend;
.post-filters_submit {
@include retina-sprite(# {
$type
}
-white);
}
}
}
Interpolated variables also do not work in other Formatting options. Here's Compact:
$card-types:disruptions, post, policies, forms;
@each $type in $card-types { &.pt_# { $type }
{ @extend .pt_extend;
.post-filters_submit { @include retina-sprite(# { $type }
-white); }
}
}