Два селектора одновременно?

Question

[art style]

структура блоков такая

-block1
--block2

в коде это выглядит так же

.block1
 text-align: center
 .block2
  text-align: left

по мере скролла к .block1 добавляется еще один класс допустим назовем его BOOST
теперь я хочу изменить стиль block2 когда к block1 добавится boost
как это будет выглядеть в sass?
в css у меня это выглядело просто .boost .block1 но в sass так не работает...
я могу написать отдельно стили .boost .block1 но они не будут работать хоть и будут применяться а при нестинге это вообще не работает

Comments

[Ankhena]

в css у меня это выглядело просто .boost .block1 но в sass так не работает...

Это оно в CSS так не работает.

Вы пишете, что boost добавляется к block1, значит в результате .boost .block1 не должно быть пробела, вот так .boost.block1.
И без разницы на чем вы там пишете.

Более того, можно не писать двойной класс

.block1  .block2 {красный}
.boost  .block2 {синий}

Сработает синий при наличии класса boost у block1.

Не сработать это может, только если вы до этого где-то намудрили со специфичностью или порядком следования селекторов.

[art style]

Ankhena, не работает. я думаю проблема в синтаксисе препроцессора. что-то неправильно написано. в любом случае ушел от этого кривого скрипта добавления класса

[Ankhena]

art style, значит, вы пишете неверно.
Сделайте песочницу с кодом и воспроизводимой проблемой.

Answer 1

[Сергей delphinpro]

.block1 {
  text-align: center;
  
  .block2 {
    text-align: left;
  }

  &.boost .block2 {
    color: red; 
  }
}

Comments

[art style]

не сработало

[WapSter]

art style, значит ты плохо объяснил или сделал, что-то не так. Код рабочий и решает твою задачу.

[art style]

WapSter, объяснение проще некуда. использую sass+vscode но так не работает. в любом случае отметил решением

[Сергей delphinpro]

art style, Почему не работает?

На выходе будет такой css код:

.block1 { text-align: center; }
.block1  .block2 { text-align: left; }
.block1.boost .block2 { color: red; }

А вам что нужно было?