Как + = в SCSS?

Question

Кто-нибудь знает, как + = с SCSS?

Пример:

.example {
    padding: 2px;
    &:hover {
        padding: current_padding + 3px; // OR
        padding+= 3px                   //... something like this
    }
}

Я пытаюсь получить .example: hover для заполнения 5px.

Answer 1

Я не думаю, что есть способ сделать именно то, что вы хотите в SCSS, но вы могли бы добиться того же эффекта, используя переменные:

SCSS

.example {
    $padding: 2px;
    padding: $padding;
    &:hover {
        padding: $padding + 3px;
    }
}

Компилируется в

.example { padding: 2px; }
.example:hover { padding: 5px; }

См. Документацию по переменным и числовым операциям .