Refactor

Author: Minh Tran

.bowerrc

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

.eslintrc

@@ -43,7 +43,7 @@
     "no-unused-expressions": 2,
     "space-after-keywords": 2,
     "space-before-blocks": 2,
-    "jsx-quotes": [1, "prefer-single"],
+    "jsx-quotes": [1, "prefer-double"],
     "react/display-name": 0,
     "react/jsx-boolean-value": [2, "always"],
     "react/jsx-no-undef": 2,
@@ -53,7 +53,7 @@
     "react/jsx-uses-vars": 2,
     "react/no-did-mount-set-state": 2,
     "react/no-did-update-set-state": 2,
-    "react/no-multi-comp": 2,
+    "react/no-multi-comp": [2, {"ignoreStateless": true}],
     "react/no-unknown-property": 2,
     "react/prop-types": 1,
     "react/react-in-jsx-scope": 2,

bower.json

@@ -20,7 +20,5 @@
     "tests"
   ],
   "dependencies": {},
-  "devDependencies": {
-    "bootstrap-customize": "~3.3.4"
-  }
+  "devDependencies": {}
 }

example/app/app.js

@@ -2,28 +2,28 @@ import 'babel-core/polyfill';
 
 import React from 'react';
 import ReactDOM from 'react-dom';
-import {createHistory, useBasename} from 'history';
-import Router from 'react-router';
+import {createHistory} from 'history';
+import {Router, useRouterHistory} from 'react-router';
 import App from 'components/App.js';
 import {name} from '../../package.json';
 
-import 'assets/bower_components/bootstrap-customize/css/bootstrap.css';
+import 'bootstrap/dist/css/bootstrap.css';
 import 'react-progress-bar-plus/src/progress-bar.scss';
 import 'assets/styles/app.scss';
 
 const routes = {
   path: '/',
   component: App,
   indexRoute: {
-    component: require('./components/pages/Home')
+    component: require('components/pages/Home')
   },
   childRoutes: [
-    require('./routes/Example1Route')
+    require('routes/AutoIncrement')
   ]
 };
 
 const DEV = process && process.env && process.env.NODE_ENV === 'development';
-const history = useBasename(createHistory)({
+const history = useRouterHistory(createHistory)({
   basename: '/' + (DEV ? '' : name)
 });
 

example/app/assets/styles/_animations.scss

@@ -0,0 +1,33 @@
+/* Pre Render
+   ========================================================================== */
+@keyframes spinner {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}
+
+.pre-render {
+  background: rgba(255, 255, 255, .7);
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 99999;
+  .spinner {
+    width: 48px;
+    height: 48px;
+    border: 1px solid lighten($primary, 40%);
+    border-left-color: darken($primary, 10%);
+    border-radius: 50%;
+    animation: spinner 700ms infinite linear;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    margin-left: -24px;
+    margin-top: -24px;
+  }
+}

example/app/assets/styles/_common.scss

@@ -0,0 +1,32 @@
+/* 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;
+}