我正在尝试生成动态调色板,以便使用来自同一范围的不同品牌颜色数量的多个网站。我有一个mixin创建了我需要的颜色范围:
.generate-colors(6); // create six evenly spaced colors
.generate-colors(@n, @i: 1) when (@i =< @n) {
@range: 160;
@gap: @range / @n;
// output the background color rule
.bgcol-@{i} {
background-color: hsv(160 + ((@i - 1) * @gap), 30%, 75%);
}
// output text colour rule
.col-@{i} {
color: hsv(160 + ((@i - 1) * @gap), 30%, 75%);
}
.generate-colors(@n, (@i + 1));
}
我遇到的问题是,生成LESS参数是有用的,这样我就可以将这些颜色重新用于边框等。
如果我没有使用mixins,我只会这样做:
@col-1: red;
@col-2: green; //etc
但我很乐意让mixin为我生成。我在mixin中尝试过这样的事情:
~"@col-{n}": @c;
没有运气 - 这是可能的,还是我走得太远?真的很感激任何帮助 - 即使它是“不可能的”。