O'Reilly logo

Grunt Cookbook by Jurie-Jan Botha

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Defining custom functions with LESS

In this recipe, we'll make use of the contrib-less (0.11.4) plugin to define custom functions that can be used in our LESS style sheets.

For our example, we'll create a custom function called halfDarken, which will darken any color provided to it by 50 percent. It will make use of the LESS library's built-in darken function.

Getting ready

In this example, we'll work with the basic project structure that we created in the Compiling LESS to CSS recipe of this chapter. Be sure to refer to it if you are not yet familiar with its contents.

How to do it...

The following steps will take us through altering our configuration to define a custom function, and altering our LESS style sheet to use it:

  1. First, we'll alter the configuration ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required