Less compiling variable with other variable name error

Question

I have a problem with variables declared with other variable name. In the below mixin I have a variable declared with other variable name like:

.label-color(@color) {
  @label-class:~"label-@{color}";
  @badge-class:~"badge-@{color}";
    @label-color:@@label-class;


 .@{label-class}, .@{badge-class} {
    background-color:@label-color !important;
 }  
}


.label-arrow(@color) {
   @label-class:~"label-@{color}";
   @label-color:@@label-class;

  .@{label-class}{
    &.arrowed:before {
        border-right-color:@label-color;
    }
    &.arrowed-in:before {
        border-color:@label-color;
    }
    &.arrowed-right:after {
        border-left-color:@label-color;
    }
    &.arrowed-in-right:after {
        border-color:@label-color;
    }
  }
}

Unfortunately my compiler does not recognize this kind of @label-color:@@label-class; and pull out error at this line. What modification should I do in order to compile well this part of my less.

If your compiler does not understand @@ (btw., which one is it? I thought they all do) there's not much you can do except changing the compiler. Theoretically it is possible to rewrite anything w/o @@ but we need to see all involved code (in particular how, where and more important why these @label-[color] variables are defined that way). — seven-phases-max
– seven-phases-max, Commented Jun 18, 2014 at 11:24
Btw., this is the same example as this one, where do you guys take this code from? (I can't be sure w/o seeing it all but it's definitely looks like a slightly overengineered snippet and most likely it can be simplified). — seven-phases-max
– seven-phases-max, Commented Jun 18, 2014 at 11:24
@ I have this less from a theme and crunch compile very well but unfortunately less4j is not compiling @@ :| and I have in my project less4j that compile automatically . — RulerNature
– RulerNature, Commented Jun 18, 2014 at 12:39
less4j? Hmm, I was sure it does support @@. What error message do you get and what less4j version it is? — seven-phases-max
– seven-phases-max, Commented Jun 18, 2014 at 12:57
@seven-phases-max I have 1.5.4 version. error: Caused by: com.github.sommeri.less4j.Less4jException: Could not compile less. 119 error(s) occurred: ERROR file:/C:/Users/EclipseWorkspace/Project/target/classes/ro/btn/fault/themes/less/blueSilver/label-badge.less 50:16 Variable indirection works only with string values — RulerNature
– RulerNature, Commented Jun 18, 2014 at 13:27

seven-phases-max · Accepted Answer · 2014-06-18 14:00:28Z

1

Lessj4 seems to support variable referencing only by quoted string values so you have to split concatenation and escaping there (i.e. do not use ~"..." for @@ variables). E.g. the first mixin would look like this then:

.label-color(@color) {
    @label-color_: "label-@{color}";
    @label-color: @@label-color_;

    .label-@{color}, .badge-@{color} {
        background-color: @label-color !important;
    }  
}

Same changes for the second mixin. (Assuming both mixins are invoked like .label-color(~"red"); or like .label-color(potato);).

answered Jun 18, 2014 at 14:00

seven-phases-max

11.9k1 gold badge47 silver badges58 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

RulerNature Over a year ago

Are you sure this should work? If I remove ~ will raise the error variable @label-@{color} not declared :(

seven-phases-max Over a year ago

>Are you sure this should work? - No, I don't have less4j installed so I can only guess (using the docs). Ok, what does happen if you temporary replace @{color} with its actual value? Does it compile then?

Collectives™ on Stack Overflow

Less compiling variable with other variable name error

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related