속성 이름을 믹스의 인수로 전달하는 방법

Question

나는 그것이 이미 어둡지 만 가볍지 만 밝게 색을 더 어둡게 만드는 기능 / 믹스를 만들고 싶다 (정규화 / 극도화?)

은 속성 이름 (색상, 배경색, 테두리 오른쪽 색상 등)을 전달 하여이 작업을 수행 할 수 있습니까?

.normalize(@color, @amount, @prop: "color") when (lightness(@color) >= 50%)
{
    @prop:lighten(@color, @amount);
}
.normalize(@color, @amount, @prop: "color") when (lightness(@color) < 50%)
{
    @prop:darken(@color, @amount);
}

.

Answer 1

현재는 less.js github에 대한 기능 요청입니다.이렇게 Less.js 1.4에서 그것을 찾아보십시오. 그때까지 당신은 그것을 그렇게 해킹 할 수 있습니다 ...

.mixin(@prop, @value) {
    Ignore: ~"a;@{prop}:@{value}";
}

.

별로 좋지 않아 여분의 재산을 얻지 만 현재의 유일한 방법입니다.

Answer 2

Guarded Mixins는 찾고있는 것이 여야합니다. 그러나 변수를 사용하여 속성 만 정의 할 수는 없습니다.그래서 당신은 이것을 이렇게 할 수 있습니다 :

.normalize(@color, @amount) when (lightness(@color) >= 50%)
{
    color:lighten(@color, @amount);
}

.normalize(@color, @amount) when (lightness(@color) < 50%)
{
   color:darken(@color, @amount);
}

.

그래서 :

.class1 {
    .normalize(#ddd, 10%);
}

.

가 이것을 출력합니다 :

.class1 {
  color: #f7f7f7;
}

.

그러나 실제로 속성 이름을 변수로 전달할 수는 없습니다.이것은 불행하게도 덜의 제한이며, 여백 방향과 같은 것들을 위해 주변의 방식을 보았을 때, 변수를 사용하여 ol '속성을 전달할 수있는 방법이 아닙니다.

Answer 3

해당 Less 'lt'gitHub에 의해 제안 된 해결 방법이 있습니다.Cloudhaed :

.blah ()      { color: black }                 // All blahs
.blah(right)  { padding-right: 20px }          // Right blahs
.blah(left)   { padding-left: 20px }           // Left blahs

@side: left;
.class { .blah(@side) }

.

출력

.class { color: black; padding-left: 20px;}

.

어쩌면 이것이 할 것입니까?

Answer 4

v1.6.0 :

이후이 기능이 추가되었습니다.

@property: color;

.widget {
  @{property}: #0ee;
  background-@{property}: #999;
}

.

컴파일 :

.widget {
  color: #0ee;
  background-color: #999;
}

.

http://lesscss.org/features/#variables-feature-properties