scss присоединиться к классам

Итак, это пример кода "МЕНЬШЕ"

.my_class{
    color: #000;
    font: 12px/12px Arial;
    &_comething_else{ color: #f00; }
}

который будет скомпилирован в это:

.my_class{
    color: #000;
    font: 12px/12px Arial;
}


.my_class_something_else{
    color: #f00;
}

Классы ".my_class" и "_something_else" были объединены, но с SCSS этот код будет скомпилирован в это:

.my_class{
    color: #000;
    font: 12px/12px Arial;
}


.my_class _something_else{
    color: #f00;
}

где пробел после ".my_class" перед подчеркиванием в "_something_else"

Итак, есть ли способ сделать этот трюк МЕНЬШЕ в SCSS? Спасибо.


layout css sass less
person nick.skriabin    schedule 16.06.2012    source источник
comment
Я думаю, что SCSS всегда предполагает наличие пробела, когда к родительскому селектору (&) присоединяется что-то еще, кроме # шестнадцатеричной или . точки. Возможно, чтобы помочь людям написать код, который имеет смысл, но они, очевидно, упустили этот вариант использования ...   -  person sg3s    schedule 17.06.2012
comment
опубликуйте его как ответ и примите как единое целое, поскольку я не думаю, что есть «хороший» способ сделать это.   -  person sg3s    schedule 17.06.2012
comment
Ага. Пришлось ждать, рейтинга не хватало.   -  person nick.skriabin    schedule 17.06.2012

Ответы (2)


arrow_upward
2
arrow_downward

Я нашел решение. Это более уродливо, чем в LESS, но работает:

$ns: ".my_class";
.my_class{
    color: #000;
    font: 12px/12px Arial;
    #{$ns}_comething_else{ color: #f00; }
}

будет скомпилирован в

.my_class{
    color: #000;
    font: 12px/12px Arial;
}

.my_class .my_class_comething_else{
    color: #f00;
}
person nick.skriabin    schedule 17.06.2012

arrow_upward
0
arrow_downward

Даже если все еще невозможно объединить имена классов в SASS (3.2.6), я заметил, что вы можете сделать это в jsFiddle.

Вот код, который я использовал:

.elem {
    &__child {
        border: solid red;

        &-text {
            color: blue;
        }
    }
}

Посмотрите экзамен http://jsfiddle.net/nicolasmn/6cvFZ/

person nicolasmn    schedule 22.04.2013