создавать новые переменные из массива меньше

Возможно ли, что в LESS можно пройти через массив цветов и создать для них новые глобальные переменные?создавать новые переменные из массива меньше

например

//array 
@colors: 'main #0f0', 'second #f00', 'third #00f'; 

// what i would like to have: 
@main-color: #0f0; 
@second-color: #f00; 
@third-color: #00f;

уже пробовал некоторые JS циклические т.д., но я всегда stucked на самом деле передавая имена в новом переменном, или лучше сказать, новые переменный с переменной

любых идей?

источник

2015-03-22 ceed

см: http://stackoverflow.com/questions/29079094/less-generate-variables-with-loops –

http://runnable.com/UnP3Yzjpzm8_AAB2/how-to-modify-variables-fo r-less-js, который был бы идеей, если бы я мог получить доступ к компилятору как-то – ceed

Поскольку вы используете javascript, так или иначе просто преобразуйте свой массив строк в формат 'var: value' прямо в вашем скрипте. Не нужно беспокоиться. Обратите внимание, что 'modifyVars' изящно может принимать массивы. –

.colors(@mixin) { 
    @helpercolorname: extract(@pp-module-variations, 1); 
    .color-looper(
     1; 
     @colorname: @helpercolorname; 
     @colorvalue: ~"@{[email protected]{helpercolorname}-color}" 
    ) ; 
    .color-looper(@i;@colorname;@colorvalue) { 
     @length: length(@pp-module-variations); 
     @last: `(@{i} == @{length})` ; 
     & when (@last = false) { 
      @colorname-intern: extract(@pp-module-variations, @i + 1) ; 
      @colorvalue-intern: ~"@{[email protected]{colorname-intern}-color}"; 
      @mixin(); 
      .color-looper(@i + 1 ;@colorname:@colorname-intern;@colorvalue:@colorvalue-intern) ; 
     } 
     & when (@last = true) { 
      @mixin(); 
     } 
    } 
}

Это моя петля на данный момент работает правильно.

я definded некоторых цветов, как этот

@pp-default-color: #22A7F0;

и добавил их в

@pp-module-variations: ~"default", some, other, colors;

это успешно петлей корыта всех цветов на этой Mixin, а также передает имя и значение для него.

.colors({ 
    [email protected]{colorname} { 
     color: @colorvalue; 
    } 
})

источник

2015-03-23 22:41:12 ceed

Это выглядит немного более подробным, чем необходимо. Вкратце [этот фрагмент] (https://gist.github.com/seven-phases-max/4826dcfa1d4af42a0d44) сделает то же самое более чистым образом. –

Но, вернувшись к самому вопросу, я думаю, что решение здесь будет некоторой функцией для извлечения значения из списка по ключу. Например. используя 'at (@ pp-colors, some)' вместо '@ pp-some-color' (и я слышал, что в этом направлении развивается некоторое развитие, ведь так все работает на менее экзотических языках). –

@ seven-phase-max хорошо, этот сниппет имеет проблему, что он работает только один раз, так как область видимости менее сосательна. Так, например, если вы используете его во второй раз, это значение всегда будет первым вводом. – ceed

Это отлично работает для меня

#colors(@list,@before,@after,@style) { 
    @length: length(@list); 
    .colors(@style,@name,@color) { @style(); } 
    .-(@length); 
    .-(@i) when (@i > 0) { 
     @intern: extract(@list, @i); 
     .colors(@style,@intern,~"@{@{before}@{intern}@{after}}"); 
     .-(@i - 1); 
    } 

}

и здесь мы называем его

#colors(@pp-module-variations;pp-;-color; { 
    .colors-template(@name,@color); 
});

любые предложения по улучшению приветствуются

источник

2015-03-24 17:07:29 ceed

создавать новые переменные из массива меньше

ответ

Смежные вопросы