Since Version 1.7, Less allows you to pass complete rulesets as an argument for mixins. Rulesets, including the Less code, can be assigned to variables and passed into mixins, which also allow you to wrap blocks of the CSS code defined inside mixins. In this recipe, you will learn how to do this.
For this recipe, you will have to create a Less file called keyframes.less
, for instance. You can compile this mixins.less
file with the command-line lessc
compiler, as described in the Installing the lessc compiler with npm recipe in Chapter 1, Getting to Grips with the Basics of Less. Finally, inspect the Less code output to the console.
Create the
keyframes.less
file, and write down the following Less code into it:// Keyframes .keyframe(@name; @roules) { @-webkit-keyframes @name { @roules(); } @-o-keyframes @name { @roules(); } @keyframes @name { @roules(); } } .keyframe(progress-bar-stripes; { from { background-position...