Меньше: класс, а затем тип узла

Question

У меня есть два <p> и один <button>, которые продлят некое class по имени test. Я хочу знать, можно ли добавить определенные правила стиля в .test, а затем конкретные правила для типа элемента?

Я думал, что-то вроде этого:

.test { 
    font-weight: bold; 
    color: blue; 

    &p { 
     font-size: 26px; 
    } 

    &button { 
     font-size: 20px; 
    } 
} 

Я знаю, что это невозможно, чтобы написать это так. Этот пример предназначен только для примера концепции.

Я прочитал документацию и увы я не нашел ничего ...

Любую идею или это просто невозможно достичь?

Answer 1

Если я правильно понимаю, вы должны использовать :extend:

МИНУС:

.test { 
    font-weight: bold; 
    color: blue; 
} 

p:extend(.test) { 
    font-size: 26px; 
} 

button:extend(.test){ 
    font-size: 20px; 
} 

Выход:

.test, p, button { 
    font-weight: bold; 
    color: blue; 
} 
p { 
    font-size: 26px; 
} 
button { 
    font-size: 20px; 
}