возможны ли имена переменных mixin в LESS? - PullRequest
Новая
       21

возможны ли имена переменных mixin в LESS?

1 голос
/ 10 ноября 2010

Что я хочу сделать, так это создать миксин, который принимает аргументы и использует один или несколько аргументов в качестве имен для других миксинов, которые будут включены.

, так как я не уверен в правильности терминов, я попытаюсь объяснить на примере: 

@gradients{
    light:#fafafa; //Should these also be prefixed with @?
    dark:#888888;
}
@gradientBackground(@name,@height){
    background-image:url('../img/gradients/{@name}-{@height}.png'); //this works
    background-color:@gradients[@name];
}

.someBox{
    @gradientBackground(light;150);
}

//Expected result:
.someBox{
    background-image:url('../img/gradients/light-150.png'); //This works
    background-color:#fafafa; //This doesn't work.
}

Изображение работает, но я еще не понял, как ссылаться на соответствующий цвет из @gradients. Возможно ли это вообще?

1 Ответ

2 голосов
/ 27 марта 2011

Не думаю, что вам вообще понадобится переменная @gradients. Просто определите ваши переменные: 

@light:#fafafa;
@dark:#888888;

Ваш миксин не должен начинаться с @, который определяет переменную. Mixin - это просто класс. 

.gradientBackground(@name:@dark, @height:500){
    background-image:url('../img/gradients/{@name}-{@height}.png');
    background-color:@name;
}

В качестве примера я установил атрибуты для mixin равными цвету @ dark и 500 для высоты.

Тогда, когда вы захотите использовать свой миксин в другом определении, это будет выглядеть так: 

.somebox {
    .gradientBackground(@light, 150);
}

Таким образом, в тот момент, когда вы используете миксин, вы можете оставить значения по умолчанию или передать новые (например, @light & 150)

Надеюсь, это поможет!

...