This repository was archived by the owner on Apr 4, 2019. It is now read-only.
This repository was archived by the owner on Apr 4, 2019. It is now read-only.
Duplicate classes are removed from selector when extending #28
Open
Description
From sass/sass#1596:
SCSS
%my-placeholder { color: red; } .foo.foo { @extend %my-placeholder; background-color: blue; }Expected
// @extend's output .foo.foo { color: red; } // regular property output .foo.foo { background-color: blue; }Actual
// @extend's output .foo { color: red; } // regular property output .foo.foo { background-color: blue; }When using @extend in the context of a selector that uses the same class twice on the same element, the duplicate class is removed in the output of the @extend (.foo.foo becomes .foo). This is not the case for any other styles declared in the same context, for those, the selector is preserved as typed.
A common technique for increasing specificity without over-qualifying is to just duplicate the same class multiple times. This technique cannot be used with extend, because it removes the duplicate classes, thus reducing the specificity that was intentionally added.