Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Why does LESS convert #fff to white?

Tags:

css

less

dotless

If I have:

.foo
{
   background-color:#fff;
}

LESS converts this to:

.foo
{
    background-color:white;
}

Why is this? Do browsers process named colours faster than HEX values?

I'm implementing LESS using dotless. Could this be carrying out the conversion? And if so why?

like image 946
Curtis Avatar asked Sep 03 '14 09:09

Curtis


1 Answers

Differences between less.js and dotless

Color compression

In dotless we favour the color keyword over the hex code, if one matches. When compressing it chooses whichever is shorter.. e.g. #FFF, #FFFFFF, white then #FFF will be chosen, but in the case of red, the keyword red will be used.

In less.js every colour is replaced with a hex code.

The above quote is from the official Dotless GitHub page.

Notes:

  1. The second part of that quote sounds a bit contradictory to the first one but I think the first statement is clear enough on the expected behavior.
  2. As pointed out by seven-phases-max in his comment they were planning to fix this and as per Issue #332's log the DisableColorCompression flag has already been added to disable this compression.
  3. The color keyword to hex code mapping seems to be maintained in Color.cs source file.
  4. Issue 317 and Issue 168 are two other similar issues which are still in open status, so I am not sure if the DisableColorCompression flag addresses the hex code to color name conversion item fully.
like image 101
Harry Avatar answered Oct 13 '22 12:10

Harry