Search code examples
twitter-bootstrapgulpless

LESS & Bootstrap : error evaluating function `darken`: color.toHSL is not a function in file

I am working with MobileAngularUI framework.

When gulp task build my app, with LESS source files overriding some Bootstrap variables, I get a strange error:

Error evaluating function `darken`: color.toHSL is not a function in file /Users/fabio/mobileangularui/bower_components/bootstrap/less/variables.less line no. 382

In my LESS file I'm overriding some variables like this for example:

@brand-primary: #FF9900;
@my-navbar-link-color: #3399CC;

@navbar-default-color: @brand-primary;
@navbar-default-link-color: @my-navbar-link-color;

What's the problem, why I get this error?

Thanks in advance!

Solution

  • In variables.less, the @navbar-default-brand-color variable is used:

    @navbar-default-brand-color: @navbar-default-link-color;
@navbar-default-brand-hover-color: darken(@navbar-default-brand-color, 10%);

    The error you get is because the darken function (LESS native function) is not able to parse your @my-navbar-link-color, so check you have a valid color (in the snippet, it seems to be valid)