Consider a few selectors that I specify a color for. I'd like them to have a different color, when they are inside some other element. SCSS:
.a, .b, .c {
color: white;
}
.black {
.a, .b, .c {
color: black;
}
}
Can it be written shorter (wihout repeating the selectors)? I tried to use the @at-root,
.a, .b, .c {
color: white;
@at-root .black #{&} {
color: black;
}
}
but the result is not as expected:
.a, .b, .c {
color: white;
}
.black .a, .b, .c {
color: black;
}