Version 2.0.5

README-template.md

@@ -97,11 +97,11 @@ The structure of this repo is:
 
 	Correct mixin calling:
 
-			.background-image(linear-gradient(to bottom, #fb83fa 0%,#e93cec 100%))
+		.background-image(linear-gradient(to bottom, #fb83fa 0%,#e93cec 100%))
 		
 	Incorrect calling:
 
-			.background-image(~'linear-gradient(to bottom, #fb83fa 0%,#e93cec 100%)')
+		.background-image(~'linear-gradient(to bottom, #fb83fa 0%,#e93cec 100%)')
 			
 	Unfortunately, there are exceptions:
 

README.md

@@ -16,7 +16,7 @@ README.md file is automatically generated.
 **[Documentation](#documentation) |**
 
 ---
-### Current version: v2.0.4 (2013-11-11)
+### Current version: v2.0.4 (2013-11-15)
 ## Intro
 Why LESS Hat? In August 2012, while we were developing and extending [CSS Hat](www.csshat.com) for LESS we needed universal mixins. Unfortunately, none of available were good enough that would satisfy our needs and that’s  why we created new custom ones on our own, which have become the most popular mixin library for the whole LESS CSS. 
 
@@ -97,11 +97,11 @@ The structure of this repo is:
 
 	Correct mixin calling:
 
-			.background-image(linear-gradient(to bottom, #fb83fa 0%,#e93cec 100%))
+		.background-image(linear-gradient(to bottom, #fb83fa 0%,#e93cec 100%))
 		
 	Incorrect calling:
 
-			.background-image(~'linear-gradient(to bottom, #fb83fa 0%,#e93cec 100%)')
+		.background-image(~'linear-gradient(to bottom, #fb83fa 0%,#e93cec 100%)')
 			
 	Unfortunately, there are exceptions:
 

bower.json

@@ -1,5 +1,5 @@
 {
   "name": "lesshat",
-  "version": "2.0.4",
+  "version": "2.0.5",
   "main": "./build/lesshat.less"
 }

mixins/background-size/background-size.js

@@ -7,6 +7,10 @@ var backgroundSize = function backgroundSize(value) {
   var numRegex = /\d/gi;
   var numWithoutValue = /(?:\s|^)(\d+\.?\d*)(?![^(]*\)|\w|%)/gi;
 
+  if (/^[-a-zA-Z0-9]*,/.test(value)) {
+    value = value.replace(/(?:,)(?![^(]*\))/g, '');
+  }
+
   if (numRegex.test(value)) {
     value = value.replace(numWithoutValue, function(match) {
       return match + 'px';

mixins/background-size/test.js

@@ -3,11 +3,11 @@ var assert = require('assert');
 describe('background-size', function() {
 
   it('should return the same value', function(done) {
-    test.backgroundSize('cover, 100%', 'cover, 100%', done);
+    test.backgroundSize('cover 100%', 'cover 100%', done);
   });
 
   it('should return numbers with px', function(done) {
-    test.backgroundSize('400, 300', '400px, 300px', done);
+    test.backgroundSize('400 300', '400px 300px', done);
   });
 
-});
+});

mixins/font-face/font-face.less

@@ -1,12 +1,12 @@
 .font-face(@fontname, @fontfile, @fontweight:normal, @fontstyle:normal) {
 
   font-family: "@{fontname}";
-  src: url("@{fontfile}-webfont.eot");
-  src: url("@{fontfile}-webfont.eot?#iefix") format("embedded-opentype"),
-       url("@{fontfile}-webfont.woff") format("woff"),
-       url("@{fontfile}-webfont.ttf") format("truetype"),
-       url("@{fontfile}-webfont.svg#@{fontname}") format("svg");
+  src: url("@{fontfile}.eot");
+  src: url("@{fontfile}.eot?#iefix") format("embedded-opentype"),
+       url("@{fontfile}.woff") format("woff"),
+       url("@{fontfile}.ttf") format("truetype"),
+       url("@{fontfile}.svg#@{fontname}") format("svg");
   font-weight: @fontweight;
   font-style: @fontstyle;
 
-}
+}

mixins/footer.less

@@ -1 +1 @@
-// What is the magic number 08121991?
+// This is the nice place for some kind of story or something... Maybe in next version :)

mixins/keyframes/keyframes.js

@@ -7,25 +7,27 @@ var keyframes = function keyframes(value) {
   // States
   // 1 - all
   // 2 - webkit, moz, w3c
-  // 3 - webkit, moz
-  // 4 - webkit, opera
-  // 5 - webkit, w3c
-  // 6 - webkit
-  // 7 - moz, opera, w3c
-  // 8 - moz, opera
-  // 9 - moz, w3c
-  // 10 - moz
-  // 11 - opera, w3c
-  // 12 - opera
-  // 13 - w3c
+  // 3 - webkit, moz, opera
+  // 4 - webkit, opera, w3c
+  // 5 - webkit, moz
+  // 6 - webkit, opera
+  // 7 - webkit, w3c
+  // 8 - webkit
+  // 9 - moz, opera, w3c
+  // 10 - moz, opera
+  // 11 - moz, w3c
+  // 12 - moz
+  // 13 - opera, w3c
+  // 14 - opera
+  // 15 - w3c
 
   value = value || 08121991;
   var state = '@{state}';
   var value_temp = value;
   if (value == 08121991) {
     return value;
   }
-  var prefixedProperties = ['animation', 'background-size', 'box-shadow', 'column', 'transform', 'filter'];
+  var prefixedProperties = ['animation', 'transform', 'filter'];
 
   switch (state) {
     case '1':
@@ -41,43 +43,53 @@ var keyframes = function keyframes(value) {
       break;
     case '3':
       syntax('start', '@-webkit-keyframes', '-webkit-');
-      syntax('end', '@-moz-keyframes', '-moz-');
+      syntax(null, '@-moz-keyframes', '-moz-');
+      syntax('end', '@-o-keyframes', '-o-');
       break;
     case '4':
       syntax('start', '@-webkit-keyframes', '-webkit-');
-      syntax('end', '@-o-keyframes', '-o-');
+      syntax(null, '@-o-keyframes', '-o-');
+      syntax('end', '@keyframes');
       break;
     case '5':
       syntax('start', '@-webkit-keyframes', '-webkit-');
-      syntax('end', '@keyframes');
+      syntax('end', '@-moz-keyframes', '-moz-');
       break;
     case '6':
-      syntax('startend', '@-webkit-keyframes', '-webkit-');
+      syntax('start', '@-webkit-keyframes', '-webkit-');
+      syntax('end', '@-o-keyframes', '-o-');
       break;
     case '7':
+      syntax('start', '@-webkit-keyframes', '-webkit-');
+      syntax('end', '@keyframes');
+      break;
+    case '8':
+      syntax('startend', '@-webkit-keyframes', '-webkit-');
+      break;
+    case '9':
       syntax('start', '@-moz-keyframes', '-moz-');
       syntax(null, '@-o-keyframes', '-o-');
       syntax('end', '@keyframes');
       break;
-    case '8':
+    case '10':
       syntax('start', '@-moz-keyframes', '-moz-');
       syntax('end', '@-o-keyframes', '-o-');
       break;
-    case '9':
+    case '11':
       syntax('start', '@-moz-keyframes', '-moz-');
       syntax('end', '@keyframes');
       break;
-    case '10':
+    case '12':
       syntax('startend', '@-moz-keyframes', '-moz-');
       break;
-    case '11':
+    case '13':
       syntax('start', '@-o-keyframes', '-o-');
       syntax('end', '@keyframes');
       break;
-    case '12':
+    case '14':
       syntax('startend', '@-o-keyframes', '-o-');
       break;
-    case '13':
+    case '15':
       syntax('startend', '@keyframes');
       break;
   }
@@ -86,15 +98,35 @@ var keyframes = function keyframes(value) {
     var end = '}\n';
     var definition = value_temp.split(/(^[a-zA-Z0-9-]+),/g);
     var keyframes = selector + ' ' + definition[1] + '{';
+    var prefixes = ['-webkit-', '-moz-', '-ms-', ''];
 
     if (prefix) {
       prefixedProperties.forEach(function(property, index) {
         if (value.indexOf(property) !== -1) {
           definition[2] = definition[2].replace(new RegExp(property, 'g'), function(match) {
             return prefix + match;
-          })
+          });
         }
       });
+    } else {
+      definition[2] = definition[2].replace(/{([^}]+)}/g, function(match, sub) {
+        var subSplit = sub.split(';');
+        subSplit.forEach(function(css, index) {
+          prefixedProperties.forEach(function(property) {
+            if (css.indexOf(property) !== -1) {
+              subSplit[index] = '';
+              prefixes.forEach(function(vendor) {
+                subSplit[index] += css.trim().replace(new RegExp(property, 'g'), function(match) {
+                  return vendor + match;
+                }) + ';';
+              });
+            }
+          });
+        });
+
+        var temp = subSplit.join('');
+        return match.replace(sub, temp);
+      });
     }
 
     keyframes += definition[2] + end;