Можно ли сократить перечисление классов?

Question

[antimodern]

Можно ли как-то сократить? Например, выбрать псевдоэлементы одним селектором? Или какое-то условие с первым дополнительным классом? Как-то больно смотреть на эту дупликацию.

.pozitivno .hamburger-inner,
.pozitivno .hamburger-inner::before,
.pozitivno .hamburger-inner::after,
.udivitelno .hamburger-inner,
.udivitelno .hamburger-inner::before,
.udivitelno .hamburger-inner::after,
.interesno .hamburger-inner,
.interesno .hamburger-inner::before,
.interesno .hamburger-inner::after,
.smeshno .hamburger-inner,
.smeshno .hamburger-inner::before,
.smeshno .hamburger-inner::after,
.stranno .hamburger-inner,
.stranno .hamburger-inner::before,
.stranno .hamburger-inner::after,
.kreativno .hamburger-inner,
.kreativno .hamburger-inner::before,
.kreativno .hamburger-inner::after {
  @apply .bg-white;
}

Answer 1

[profesor08]

Препроцессор scss

.pozitivno, .udivitelno, .interesno, .smeshno, .stranno, .kreativno {
  .hamburger-inner {
    &:before, &:after {
      background: white;
    }
  }
}

Модификатор

.hamburger-inner.modificator {
  &:before, &:after {
    background: white;
  }
}

Comments

[antimodern]

Спасибо, SCSS вариант хороший.

А .modificator это что? Перенести типо туда добавление класса?