explode color feature

Close #40

Author: MoOx

README.md

@@ -35,9 +35,10 @@ _Follow [@cssnext](https://twitter.com/cssnext) to get latest news & [join #cssn
 * [custom properties & `var()`](http://www.w3.org/TR/css-variables/) (via [postcss-custom-properties](https://github.com/postcss/postcss-custom-properties))
 * [reduced `calc()`](https://github.com/MoOx/reduce-css-calc#readme) (via [postcss-calc](https://github.com/postcss/postcss-calc), to optimize previously parsed `var()` references)
 * [custom media queries](http://dev.w3.org/csswg/mediaqueries/#custom-mq) (via [postcss-custom-media](https://github.com/postcss/postcss-custom-media)), a nice way to avoid repeating media queries
-* [`color()`](http://dev.w3.org/csswg/css-color/#modifying-colors) (via [postcss-color](https://github.com/postcss/postcss-color)), a color function to modify color
-* [`hwb()`](http://dev.w3.org/csswg/css-color/#the-hwb-notation) (via [postcss-color](https://github.com/postcss/postcss-color)), similar to `hsl()` but easier for humans to work with
-* [#rrggbbaa](http://dev.w3.org/csswg/css-color/#hex-notation) (via [postcss-color](https://github.com/postcss/postcss-color))
+* [`color()`](http://dev.w3.org/csswg/css-color/#modifying-colors) (via [postcss-color-function](https://github.com/postcss/postcss-color-function)), a color function to modify color
+* [`hwb()`](http://dev.w3.org/csswg/css-color/#the-hwb-notation) (via [postcss-color-hwb](https://github.com/postcss/postcss-color-hwb)), similar to `hsl()` but easier for humans to work with
+* [#rrggbbaa](http://dev.w3.org/csswg/css-color/#hex-notation) (via [postcss-color-hex-alpha](https://github.com/postcss/postcss-color-hex-alpha))
+* [`rebeccapurple`](http://dev.w3.org/csswg/css-color/#valdef-color-rebeccapurple) (via [postcss-color-rebeccapurple](https://github.com/postcss/postcss-color-rebeccapurple))
 
 
 ### Additionals enhancements
@@ -131,7 +132,10 @@ Here are all available features:
 - `customProperties`
 - `calc`
 - `customMedia`
-- `color`
+- `color-function`
+- `color-hex-alpha`
+- `color-hwb`
+- `color-rebeccapurple`
 - `prefixes`
 
 ##### `browsers` (default: autoprefixer default)

index.js

@@ -4,12 +4,15 @@
 var Postcss = require("postcss")
 
 var features = {
-  import:           function(options) { return require("postcss-import")(options) },
-  customProperties: function(options) { return require("postcss-custom-properties")(options) },
-  calc:             function(options) { return require("postcss-calc")(options)},
-  customMedia:      function(options) { return require("postcss-custom-media")(options)},
-  color:            function(options) { return require("postcss-color")(options)},
-  prefixes:         function(options) { return require("autoprefixer-core")(options).postcss}
+  import:               function(options) { return require("postcss-import")(options) },
+  customProperties:     function(options) { return require("postcss-custom-properties")(options) },
+  calc:                 function(options) { return require("postcss-calc")(options)},
+  customMedia:          function(options) { return require("postcss-custom-media")(options)},
+  colorRebeccapurple:   function(options) { return require("postcss-color-rebeccapurple")(options)},
+  colorHwb:             function(options) { return require("postcss-color-hwb")(options)},
+  colorHexAlpha:        function(options) { return require("postcss-color-hex-alpha")(options)},
+  colorFunction:        function(options) { return require("postcss-color-function")(options)},
+  prefixes:             function(options) { return require("autoprefixer-core")(options).postcss}
 }
 
 /**

package.json

@@ -35,7 +35,10 @@
     "node-watch": "^0.3.4",
     "postcss": "^2.2.1",
     "postcss-calc": "^2.0.1",
-    "postcss-color": "^1.0.0",
+    "postcss-color-function": "^1.0.0",
+    "postcss-color-hex-alpha": "^1.0.0",
+    "postcss-color-hwb": "^1.0.0",
+    "postcss-color-rebeccapurple": "^1.0.0",
     "postcss-custom-media": "^1.0.0",
     "postcss-custom-properties": "^0.3.1",
     "postcss-import": "^1.0.1",

test/features/color-function.css

@@ -0,0 +1,3 @@
+body {
+  background: color(rgb(102, 51, 153) a(90%))
+}

test/features/color-function.expected.css

@@ -0,0 +1,3 @@
+body {
+  background: rgba(102, 51, 153, 0.9)
+}

test/features/color-hex-alpha.css

@@ -0,0 +1,3 @@
+body {
+  background: #9d9c
+}

test/features/color-hex-alpha.expected.css

@@ -0,0 +1,3 @@
+body {
+  background: rgba(153, 221, 153, 0.8)
+}

test/features/color-hwb.css

@@ -0,0 +1,3 @@
+body {
+  background: hwb(0, 20%, 40%)
+}

test/features/color-hwb.expected.css

@@ -0,0 +1,3 @@
+body {
+  background: rgb(153, 51, 51)
+}

test/features/color-rebeccapurple.css

@@ -0,0 +1,3 @@
+body {
+  background: rebeccapurple
+}

test/features/color-rebeccapurple.expected.css

@@ -0,0 +1,3 @@
+body {
+  background: rgb(102, 51, 153)
+}