Информация о LESS Mixins

Question

Просто (надеюсь) быстрый вопрос о LESS Mixins: Не могли бы эти два микшина каким-то образом скомбинироваться ?, так как они разделяют много одинаковой информации, только один добавляет дополнительный цвет.

.gradient-top(@color-1, @color-2){ 
    background-color: @color-2; 
    background: -webkit-linear-gradient(top, @color-1, @color-2); 
    background: -moz-linear-gradient(top, @color-1, @color-2); 
    background: -ms-linear-gradient(top, @color-1, @color-2); 
    background: -o-linear-gradient(top, @color-1, @color-2); 
    background: linear-gradient(top, @color-1, @color-2); 
} 

.gradient-middle(@color-1, @color-2, @color-3){ 
    background-color: @color-2; 
    background: -webkit-linear-gradient(top, @color-1, @color-2, @color-3); 
    background: -moz-linear-gradient(top, @color-1, @color-2, @color-3); 
    background: -ms-linear-gradient(top, @color-1, @color-2, @color-3); 
    background: -o-linear-gradient(top, @color-1, @color-2, @color-3); 
    background: linear-gradient(top, @color-1, @color-2, @color-3);  
} 

Answer 1

МЕНЬШЕ поддерживает обращающуюся все аргументы, передаваемые в Mixin через @arguments переменные:

.gradient(@color-1, @color-2, ...) { 
    @gradient-stops: ~`"@{arguments}".slice(1, -1)`; 
    background-color: @color-2; 
    background: -webkit-linear-gradient(top, @gradient-stops); 
    background: -moz-linear-gradient(top, @gradient-stops); 
    background: -ms-linear-gradient(top, @gradient-stops); 
    background: -o-linear-gradient(top, @gradient-stops); 
    background: linear-gradient(top, @gradient-stops); 
} 

Нам нужна интерполяция селектора (~) и встроенный оценку JavaScript (используя кавычку), чтобы сохранить запятые - в противном случае мы получили бы background: linear-gradient(top, #color-1 #color-2 #color-n);, что, конечно, неверно.

Другая вещь эта примесь делает принимать 2 или более аргументы через символ «покоиться» (...) - это позволяет нам называть смешивание с тремя цветами, а также два:

.gradient(#FFF, #CCC, #000) // A valid invocation of the mixin