Make @extend available for nested selectors

Hi,

currently if you try to extend a class, for example #content input it will throw a error like: “Syntax error: Can’t extend #content input: can’t extend nested selectors”.

It would be great if that would be available!

[whaaaley]

I think the best way to fix the problem your having is by using a placeholder like this:

%blue {
    color: blue;
    font-weight: bold;
}

#content {
    input {
        @extend %blue;
    }
}

.content-other {
    .content-nested {
        @extend %blue;
    }
}

I think extending nested selectors would get confusing easily. By using a placeholder it also makes it available if you ever want to use it again without having to remember that the styles you want to use are in #content input

See these issues for explanations: #609 and #251.

[chriseppstein]

@dustindowell22 nailed this. The rationale is that if you need to extend a modified thing, that thing is worth naming and extracting to it’s own concept.