<===> non_conformant/input.scss
// TODO: rewrite these test cases to follow the style guide.
.name-interpolation {
// If the entire name is interpolated, SassScript is allowed on the
// right-hand side because we don't know it's a custom property at parse time.
#{--entire}: 1 + 2;
// Same if the first hyphen is interpolated.
-#{-first-hyphen}: 1 + 2;
// But if the name is interpolated, the right-hand side is static.
--#{only-name}: 1 + 2;
// However, interpolation is still allowed on the right-hand side.
--#{only-name-interp-value}: #{1 + 2};
// The name can also be partially interpolated.
--#{initial}-interp: 1 + 2;
--midd#{le-int}erp: 1 + 2;
--final-#{interp}: 1 + 2;
--#{doub}le-int#{erp}: 1 + 2;
}
<===> non_conformant/output.css
.name-interpolation {
--entire: 3;
--first-hyphen: 3;
--only-name: 1 + 2;
--only-name-interp-value: 3;
--initial-interp: 1 + 2;
--middle-interp: 1 + 2;
--final-interp: 1 + 2;
--double-interp: 1 + 2;
}
<===>
================================================================================
<===> nested_properties/input.scss
// Regression test for sass/dart-sass#1095
a {
#{--b}: {c: d}
}
<===> nested_properties/output.css
a {
--b-c: d;
}