Возможен ли в scss селектор c несколькими амперсантами?

Question

[kherel]

как дважды использовать амеперсант в селекторе
css результат должен получится такой:

root_social.root_last{
    color: red;
}

scss с одним амперсантом работает

.root{ 
    &_social.root_last{
        color: red;
    }
}

&_social&_last - не работает

Answer 1

[Mike Syomin]

Пробуй

.root{ 
    &_social#{&}_last{
      color: red;
    }
}

Читай
https://css-tricks.com/the-sass-ampersand/

Comments

[kherel]

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

.root{ 
    ..
    &_social{
        ..
        (???)_last &{
            color: red;
        }
    }
}

[Mike Syomin]

kherel: Боюсь, что это анпосебл в сасе. Зачем вообще так извращаться?

[Mike Syomin]

Хотя разве что так
.root{
&_social{
color: red;
@at-root #{&}.root_last {
color: black;
}
}
}

[kherel]

Mike Syomin: да использую в react вместе catnip, там генеряться названия классов из получаемых свойств. получается можно делать такие компоненты которые в зависимости от свойств будут отображаться по разному. и удобно все в одной сасс ветке записывать..