Updating to use detached rulesets, with .keyframes example

[lourd]

Starting in Less 1.7.0, there is now a feature in Less called detached rulesets.

Detached ruleset is a group of css properties, nested rulesets, media declarations or anything else stored in a variable. You can include it into a ruleset or another structure and all its properties are going to be copied there. You can also use it as a mixin argument and pass it around as any other variable.

Lesshat could be greatly simplified by making use of this feature. For example, the current keyframes mixin is over 2000 characters long when compressed/minified. It can be rewritten in 200 using a ruleset parameter (and no Javascript)

.keyframes (@name, @frames) {
  @-webkit-keyframes @name { @frames(); }
  @-moz-keyframes @name { @frames(); }
  @-ms-keyframes @name { @frames(); }
  @-o-keyframes @name { @frames(); }
  @keyframes @name { @frames(); }
}

Almost all of the mixins could benefit using this feature.

[mboudreau]

This is good idea. I'll have to look into it. If you (or someone else) wants to do it and create a PR, that would be fantastic.