Refactor

.babelrc

@@ -0,0 +1,4 @@
+{
+  "stage": 0,
+  "optional": []
+}

.bowerrc

@@ -1,3 +1,3 @@
 {
-  "directory": "example/bower_components"
+  "directory": "example/app/bower_components"
 }

.editorconfig

@@ -0,0 +1,13 @@
+# http://editorconfig.org
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false

.eslintrc

@@ -24,12 +24,28 @@
   "rules": {
     "strict": 0,
     "curly": 0,
-    "quotes": [2, "single"],
+    "quotes": [2, "single", "avoid-escape"],
+    "semi": 2,
     "no-underscore-dangle": 0,
+    "no-unused-vars": [2, {"args": "all"}],
     "camelcase": [2, {"properties": "never"}],
     "new-cap": 0,
-    "react/jsx-boolean-value": 2,
-    "react/jsx-quotes": 2,
+    "accessor-pairs": 0,
+    "brace-style": [2, "1tbs"],
+    "consistent-return": 2,
+    "dot-location": [2, "property"],
+    "dot-notation": 2,
+    "eol-last": 2,
+    "indent": [2, 2, {"SwitchCase": 1}],
+    "no-bitwise": 0,
+    "no-multi-spaces": 2,
+    "no-shadow": 2,
+    "no-unused-expressions": 2,
+    "space-after-keywords": 2,
+    "space-before-blocks": 2,
+    "jsx-quotes": [1, "prefer-single"],
+    "react/display-name": 0,
+    "react/jsx-boolean-value": [2, "always"],
     "react/jsx-no-undef": 2,
     "react/jsx-sort-props": 0,
     "react/jsx-sort-prop-types": 0,
@@ -38,11 +54,12 @@
     "react/no-did-mount-set-state": 2,
     "react/no-did-update-set-state": 2,
     "react/no-multi-comp": 2,
-    "react/no-unknown-property": 1,
+    "react/no-unknown-property": 2,
     "react/prop-types": 1,
     "react/react-in-jsx-scope": 2,
     "react/self-closing-comp": 2,
-    "react/wrap-multilines": 0
+    "react/sort-comp": 0,
+    "react/wrap-multilines": [2, {"declaration": false, "assignment": false}]
   },
   "globals": {
     "inject": false,

.gitignore

@@ -1,5 +1,4 @@
 .idea
-.tmp
-dist
-example/bower_components
 node_modules
+bower_components
+example/dist

.npmignore

@@ -1,5 +1,2 @@
 .idea
-.tmp
-dist
-.bowerrc
-bower.json
+example

bower.json

@@ -17,7 +17,8 @@
     "test",
     "tests"
   ],
+  "dependencies": {},
   "devDependencies": {
     "bootstrap-customize": "~3.3.4"
   }
-}
+}

example/app.js → example/app/app.js

@@ -1,32 +1,33 @@
-var React = require('react');
+import 'babel-core/polyfill';
+import React from 'react';
+import ReactDOM from 'react-dom';
+import Header from './components/Header.js';
+import Footer from './components/Footer.js';
+import Notifications from 'react-notifications';
 
-require('./bower_components/bootstrap-customize/css/bootstrap.css');
-require('./assets/styles/app.scss');
-require('../src/notifications.scss');
+import './bower_components/bootstrap-customize/css/bootstrap.css';
+import 'react-notifications/lib/notifications.scss';
+import './assets/styles/app.scss';
 
-var Header = require('./components/Header');
-var Footer = require('./components/Footer');
-var Notifications = require('../src/Notifications');
+class App extends React.Component {
+  state = {
+    notifications: []
+  };
 
-var App = React.createClass({
-  getInitialState: function () {
-    return {
-      notifications: []
-    };
-  },
-  handleRequestHide: function (notification) {
-    var notifications = this.state.notifications.filter(function (n) {
+  handleRequestHide = (notification) => {
+    let notifications = this.state.notifications.filter(function (n) {
       return n.id !== notification.id;
     });
     this.setState({
       notifications: notifications
     });
-  },
-  createNotification: function (type) {
+  };
+
+  createNotification = (type) => {
     return function () {
-      var notifications = this.state.notifications;
-      var id = new Date().getTime();
-      var notification = {
+      let notifications = this.state.notifications;
+      let id = new Date().getTime();
+      let notification = {
         id: id,
         type: type,
         title: 'Title',
@@ -41,13 +42,14 @@ var App = React.createClass({
         notifications: notifications
       });
     }.bind(this);
-  },
-  render: function () {
+  };
+
+  render() {
     return (
-      <div className={"layout-page"}>
+      <div className='layout-page'>
         <Header/>
-        <main className={"layout-main"}>
-          <div className={"container"}>
+        <main className='layout-main'>
+          <div className='container'>
             <button className='btn btn-info'
               onClick={this.createNotification('info')}>Info
             </button>
@@ -71,7 +73,14 @@ var App = React.createClass({
       </div>
     );
   }
-});
+}
 
-React.render(<App />, document.body);
+function run() {
+  ReactDOM.render(<App />, document.getElementById('app'));
+}
 
+if (window.addEventListener) {
+  window.addEventListener('DOMContentLoaded', run);
+} else {
+  window.attachEvent('onload', run);
+}

example/app/assets/styles/app.scss

@@ -0,0 +1,36 @@
+body {
+  font-size: 14px;
+}
+
+/* Header
+   ========================================================================== */
+.navbar {
+  border-radius: 0;
+}
+
+/* Footer
+   ========================================================================== */
+html,
+body,
+#app {
+  height: 100%;
+}
+
+.layout-page {
+  position: relative;
+  min-height: 100%;
+  padding-bottom: 60px;
+}
+
+.layout-main {
+  margin-bottom: 30px;
+}
+
+.layout-footer {
+  position: absolute;
+  bottom: 0;
+  width: 100%;
+  height: 60px;
+  background-color: #F8F8F8;
+  padding: 20px 0;
+}

example/app/bower_components/bootstrap-customize/.bower.json

@@ -0,0 +1,23 @@
+{
+  "name": "bootstrap-customize",
+  "version": "3.3.5",
+  "description": "Twitter Bootstrap without Javascript, Glyphicons.",
+  "main": [
+    "css/bootstrap.css"
+  ],
+  "license": "MIT",
+  "ignore": [
+    "**/.*",
+    "config.json"
+  ],
+  "homepage": "https://github.com/vn38minhtran/bootstrap-customize",
+  "_release": "3.3.5",
+  "_resolution": {
+    "type": "version",
+    "tag": "v3.3.5",
+    "commit": "1d422df4d1263e057f66dd6de22f833178639d7e"
+  },
+  "_source": "git://github.com/vn38minhtran/bootstrap-customize.git",
+  "_target": "~3.3.4",
+  "_originalSource": "bootstrap-customize"
+}

example/app/bower_components/bootstrap-customize/README.md

@@ -0,0 +1,3 @@
+# Bootstrap Customize
+
+Twitter Bootstrap without Javascript, Glyphicons.

example/app/bower_components/bootstrap-customize/bower.json

@@ -0,0 +1,11 @@
+{
+  "name": "bootstrap-customize",
+  "version": "3.3.5",
+  "description": "Twitter Bootstrap without Javascript, Glyphicons.",
+  "main": ["css/bootstrap.css"],
+  "license": "MIT",
+  "ignore": [
+    "**/.*",
+    "config.json"
+  ]
+}