CODEWITHSUNDEEP
cssconditional-statementslessmixins
Ken Hirakawa
Ken Hirakawa

Reputation: 8251

less.js guards and conditionals

I have the following less mixin:

@myColor = #123456;

.mixin(@a) when (@a = @myColor){ // do something }

This however throws this error: Unable to perform comparison

Why is that?

Upvotes: 1

Views: 2296

Answers (3)

VikomiC
VikomiC

Reputation: 91

Just update less.js to the last version (1.2.2 - current) and it will work.

I had the same problem. Now it fixed for me (My question with code example: Lesscss Mixins with guards. Syntax Error ). I think, it will be fixed and for your example.

Upvotes: 0

rabidcow
rabidcow

Reputation: 36

It would appear (as of lesscss 1.2.2) that guards only support comparing Dimensions and Keywords. (search the source for "compare:") So, sadly, comparing two colors or strings just won't work.

Upvotes: 2

ScottS
ScottS

Reputation: 72271

UPDATE: Four thoughts (again, I don't have experience with LESS itself, I'm just looking at documentation).

  1. Is the variable you are passing to the mixin (the @a) a color in hex format? Perhaps it cannot do the comparison because you are passing a different variable type.

  2. Just to be sure, did you double check that you called the right variable (@myColor) not (@mycolor).

  3. Have you tried reversing the when to (@myColor = @a) to see if that works. On the one example at http://lesscss.org/ where they use a variable not defined in the mixin (they use @media) that is the order they have it in.

  4. Finally, my first original answer was to try:

    .mixin(@a, @b: @myColor) when (@a = @b){ // do something }

Upvotes: 0

Related Questions