small fix

README.md

@@ -1,4 +1,4 @@
-# react-easy-style
+# React Easy Style
 
 A tiny library to easy apply css/styles to react components.
 
@@ -8,15 +8,18 @@ A tiny library to easy apply css/styles to react components.
 
 `npm install react-easy-style`
 
+you'll need also:
+`webpack`, `css-loader`, `react`
+
 ## Why?
 The React community is highly fragmented when it comes to styling. Right now, there is more then 16 project for inline css on the github, all of they are trying to fix some "issue" that css has, like global scope... but, I think, they all are creating a lot of new one as well.
 
+**React Easy Style** "borrow" ideas from some one of this project: react-css (1). And join it with webpack css-loader (2) to make a very light and useful library to easy use classes and styles on react components.
+
 1. [react-css](http://reactcss.com/): seems to be the only one to have noticed that style and react props/state are strong linked to each other.
 
 2. [webpack css-loader](https://github.com/webpack/css-loader): with support to [CSS Module spec](https://github.com/css-modules/css-modules) has fixed css global scope issue.
 
-This project "borrow" ideas from react-css and join with webpack css-loader to make a very light and useful library to easy use classes and styles on react components.
-
 
 ## How?
 
@@ -234,6 +237,20 @@ class Col extends React.Component {}
 :local .col { /** ... **/ }
 ```
 
+## Example of webpack config to use css-loader
+
+```javascript
+// webpack.config.js
+module: {
+  loaders: [
+    { test: /\.(js|jsx)$/, exclude: /(node_modules)/, loader: 'babel?stage=0' },
+    { test: /\.scss$/, loader: "style!css!sass" },
+    { test: /\.css$/, loader: "style!css" }
+  ]
+}
+```
+
+
 
 ## All this is pretty cool... but I want to use inline styles.
 

lib/index.js

@@ -101,24 +101,29 @@ function EasyStyle(styleOrClass) {
 
       for (var k in allProps) {
         var v = allProps[k];
-        propsKlzz.push(getStyleProp(k, v));
+        var sp = getStyleProp(k, v);
+        sp && propsKlzz.push(sp);
       }
     }
 
     var className = (0, _classnames2['default'])(isClass ? styleOrClass[isName] : null, isClass ? propsKlzz : null, node.props.className, this.props[(isRoot ? 'root' : is) + 'Classes'], _defineProperty({}, this.props.className, isRoot && this.props.className));
 
+    if (className === '') {
+      className = null;
+    }
+
     //
-    // ok, let see style now
+    // ok, let see styles now
     //
 
-    var mergePropsKlzz = function mergePropsKlzz() {
+    var propsKlzzReducer = function propsKlzzReducer() {
       return propsKlzz.reduce(function (memo, item) {
         memo = _extends({}, memo, item);
         return memo;
       }, {});
     };
 
-    var propsIfStyle = isClass ? {} : _extends({}, styleOrClass['default'] && styleOrClass['default'][isName], mergePropsKlzz());
+    var propsIfStyle = isClass ? {} : _extends({}, styleOrClass['base'] && styleOrClass['base'][isName], propsKlzzReducer());
 
     var style = _extends({}, propsIfStyle, node.props.style, this.props[(isRoot ? 'root' : is) + 'Style'], isRoot && this.props.style);
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-easy-style",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "A tiny library to easy apply css/styles to react components",
   "main": "lib/index.js",
   "repository": {

src/index.js

@@ -82,24 +82,29 @@ export default function EasyStyle(styleOrClass, rootName='root') {
       const allProps = {...this.state, ...this.props}
 
       for (let k in allProps) {
-        const v = allProps[k]
-        propsKlzz.push(getStyleProp(k,v))
+        const v  = allProps[k]
+        const sp = getStyleProp(k, v)
+        sp && propsKlzz.push(sp)
       }
     }
 
-    const className = cx(
+    let className = cx(
       isClass ? styleOrClass[isName] : null,
       isClass ? propsKlzz : null,
       node.props.className,
       this.props[(isRoot ? 'root' : is)+'Classes'],
       {[this.props.className]: isRoot && this.props.className}
     )
 
+    if (className === '') {
+      className = null
+    }
+
     //
-    // ok, let see style now
+    // ok, let see styles now
     //
 
-    const mergePropsKlzz = () => {
+    const propsKlzzReducer = () => {
       return propsKlzz.reduce( (memo, item) => {
         memo = {...memo, ...item}
         return memo
@@ -108,7 +113,7 @@ export default function EasyStyle(styleOrClass, rootName='root') {
 
     const propsIfStyle = isClass ? {} : {
       ...( styleOrClass['base'] && styleOrClass['base'][isName] ),
-      ...( mergePropsKlzz() )
+      ...( propsKlzzReducer() )
     }
 
     const style = {