Optimise none keyword in border and outline properties (#41) (#332)

lib/replace/Value.js

@@ -2,7 +2,9 @@ var resolveName = require('css-tree').property;
 var handlers = {
     'font': require('./property/font.js'),
     'font-weight': require('./property/font-weight.js'),
-    'background': require('./property/background.js')
+    'background': require('./property/background.js'),
+    'border': require('./property/border.js'),
+    'outline': require('./property/border.js')
 };
 
 module.exports = function compressValue(node) {

lib/replace/property/border.js

@@ -0,0 +1,31 @@
+function removeItemAndRedundantWhiteSpace(list, item) {
+    var prev = item.prev;
+    var next = item.next;
+
+    if (next !== null) {
+        if (next.data.type === 'WhiteSpace' && (prev === null || prev.data.type === 'WhiteSpace')) {
+            list.remove(next);
+        }
+    } else if (prev !== null && prev.data.type === 'WhiteSpace') {
+        list.remove(prev);
+    }
+
+    list.remove(item);
+}
+
+module.exports = function compressBorder(node) {
+    node.children.each(function(node, item, list) {
+        if (node.type === 'Identifier' && node.name.toLowerCase() === 'none') {
+            if (list.head === list.tail) {
+                // replace `none` for zero when `none` is a single term
+                item.data = {
+                    type: 'Number',
+                    loc: node.loc,
+                    value: '0'
+                };
+            } else {
+                removeItemAndRedundantWhiteSpace(list, item);
+            }
+        }
+    });
+};

test/fixture/compress/disjoin/1.css

@@ -32,5 +32,5 @@ b {
 
 /*!
   better solution
-  a,b,foo{color:red;width:200px}foo{border:none}b,foo{color:#00f;height:50px}@media (min-width:400px){a,b,foo{color:red;width:200px}foo{border:none}b,foo{color:#00f;height:50px}}
+  a,b,foo{color:red;width:200px}foo{border:0}b,foo{color:#00f;height:50px}@media (min-width:400px){a,b,foo{color:red;width:200px}foo{border:0}b,foo{color:#00f;height:50px}}
 */

test/fixture/compress/disjoin/1.min.css

@@ -1,5 +1,5 @@
-a{color:red;width:200px}foo{border:none}b,foo{color:#00f;width:200px;height:50px}@media (min-width:400px){a{color:red;width:200px}foo{border:none}b,foo{color:#00f;width:200px;height:50px}}
+a{color:red;width:200px}foo{border:0}b,foo{color:#00f;width:200px;height:50px}@media (min-width:400px){a{color:red;width:200px}foo{border:0}b,foo{color:#00f;width:200px;height:50px}}
 /*!
   better solution
-  a,b,foo{color:red;width:200px}foo{border:none}b,foo{color:#00f;height:50px}@media (min-width:400px){a,b,foo{color:red;width:200px}foo{border:none}b,foo{color:#00f;height:50px}}
+  a,b,foo{color:red;width:200px}foo{border:0}b,foo{color:#00f;height:50px}@media (min-width:400px){a,b,foo{color:red;width:200px}foo{border:0}b,foo{color:#00f;height:50px}}
 */

test/fixture/compress/issue/39-5.min.css

@@ -1 +1 @@
-a,b:test{color:red;border:none}
+a,b:test{color:red;border:0}

test/fixture/compress/issue/39-6.min.css

@@ -1 +1 @@
-:test{color:#00f;border:none}a{color:green}
+:test{color:#00f;border:0}a{color:green}

test/fixture/compress/none-to-zero.css

@@ -0,0 +1,11 @@
+.o { outline: 1px none red }
+.o-none { outline: none }
+.o-none-red { outline: none red }
+.o-red-none { outline: red none }
+.o-reverse { outline: none 1px red }
+
+.b { border: 1px none red }
+.b-none { border: none }
+.b-none-red { border: none red }
+.b-red-none { border: red none }
+.b-reverse { border: none 1px red }

test/fixture/compress/none-to-zero.min.css

@@ -0,0 +1 @@
+.o{outline:1px red}.o-none{outline:0}.o-none-red,.o-red-none{outline:red}.o-reverse{outline:1px red}.b{border:1px red}.b-none{border:0}.b-none-red,.b-red-none{border:red}.b-reverse{border:1px red}