Disallow linebreaks before Sass operators.
a { width: 10px
+ $n; }
/** ↑
* Linebreaks before this */
This rule checks math operators (+
, -
, /
, *
, %
) and comparison operators (>
, <
, !=
, ==
, >=
, <=
).
Not all symbols that correspond to math operators are actually considered operators by Sass. Some of the exceptions are:
+
and-
as signs before values;+
and-
as signs in space-delimited lists;-
as part of a string or a Sass identifier, e.g. a variable;/
as a CSS delimiter in property values likefont: 10px/1.2 Arial;
(read more).
For more details refer to Sass official documentation. An online Sass compiler - Sassmeister - could also come in handy.
The following patterns are considered warnings:
a { width: 10
+ 1; }
a {
width: 10
+ 1;
}
The following patterns are not considered warnings:
a {
width: 10px
-1; // not a math operator, ignored
}
a { width: 10px - 1; }
a {
width: 100px +
$var * 0.5625; // the newline is not right before the operator
}