CODEWITHSUNDEEP
csscompilationless
Adrian
Adrian

Reputation: 45

LESS ParseError: Unrecognised input

I am getting an error when I compile this code here with WINLess:

.icon-text-shadow (@icon-text-shadow: 0.0625rem 0.0625rem rgba(132, 108, 172, 1), 0.125rem 0.125rem rgba(132, 108, 172, 1);) {
    box-shadow: @icon-text-shadow;
    -moz-box-shadow: @icon-text-shadow;
    -webkit-box-shadow: @icon-text-shadow;
}

The error is:

ParseError: Unrecognised input in PATH\file.less on line 34, column 126

The column 126 is between the last ) and the first { I am rather new at this but I have searched everywhere and got no clue still what is wrong.

Thank you for any suggestions..

Upvotes: 4

Views: 15484

Answers (4)

Anton Ilyin
Anton Ilyin

Reputation: 21

Check file encoding. If it "UTF-8 with BOM" then LESS can't directly build it. Change encoding to plain UTF-8.

Upvotes: 0

ed1nh0
ed1nh0

Reputation: 1602

You're trying to parsing a string separated by commas without escaping it.

Try this:

.icon-text-shadow (@icon-text-shadow: ~"0.0625rem 0.0625rem rgba(132, 108, 172, 1), 0.125rem 0.125rem rgba(132, 108, 172, 1)") {
    box-shadow: @icon-text-shadow;
}

Note: There's no need to use vendor prefixes for box-shadow anymore.

Upvotes: 0

Lucas S.
Lucas S.

Reputation: 2401

Looks like you just found an issue with the compiler.

Your code is perfectly fine and should work as expected. The culprit is the second rgba(132, 108, 172, 1). Delete that and it will work.

I played around a bit and it seems that this always happens when there is a comma separated list as parameter and any element of that list, that is not the first, contains a function call.

Workaround in Aureliano's answer.

Upvotes: 1

Aureliano Far Suau
Aureliano Far Suau

Reputation: 6791

I think that must be a problem with the enumeration. Try this:

@icon-text-shadow-default: 0.0625rem 0.0625rem rgba(132, 108, 172, 1), 0.125rem 0.125rem rgba(132, 108, 172, 1);
.icon-text-shadow (@icon-text-shadow: @icon-text-shadow-default) {
    box-shadow: @icon-text-shadow;
    -moz-box-shadow: @icon-text-shadow;
    -webkit-box-shadow: @icon-text-shadow; 
}

Upvotes: 1

Related Questions