added universe ui, refactored app to use scss #12

Signed-off-by: Guy Lepage <guylepage3@gmail.com>

Author: guylepage3

README.md

@@ -58,6 +58,7 @@ This project was bootstrapped with [Create React App](https://github.com/faceboo
 [![jQuery version](https://img.shields.io/badge/jQuery-v3.3.1-blue.svg?colorA=212121&colorB=007BFF)](https://jquery.com/)
 [![Node Sass Chokidar version](https://img.shields.io/badge/Node_Sass_Chokidar-v1.3.3-blue.svg?colorA=212121&colorB=007BFF)](https://github.com/michaelwayman/node-sass-chokidar)
 [![npm version](https://img.shields.io/badge/npm-v6.4.0-blue.svg?colorA=212121&colorB=007BFF)](https://www.npmjs.com/)
+[![npm Run All version](https://img.shields.io/badge/npm_Run_All-v4.1.3-blue.svg?colorA=212121&colorB=007BFF)](https://github.com/mysticatea/npm-run-all)
 [![Popper version](https://img.shields.io/badge/Popper.js-v1.14.4-blue.svg?colorA=212121&colorB=007BFF)](https://popper.js.org/)
 [![React version](https://img.shields.io/badge/React-v16.5.2-blue.svg?colorA=212121&colorB=007BFF)](https://reactjs.org/)
 [![ReactDom version](https://img.shields.io/badge/ReactDom-v16.5.2-blue.svg?colorA=212121&colorB=007BFF)](https://reactjs.org/docs/react-dom.html)

package-lock.json

@@ -4,8 +4,12 @@
   "description": "Universe is a dApp solution provider",
   "private": true,
   "scripts": {
-    "start": "react-scripts start",
-    "build": "react-scripts build",
+    "build-css": "node-sass-chokidar src/styles/ -o src/styles/",
+    "watch-css": "npm run build-css && node-sass-chokidar src/styles/ -o src/styles/ --watch --recursive",
+    "start-js": "react-scripts start",
+    "start": "npm-run-all -p watch-css start-js",
+    "build-js": "react-scripts build",
+    "build": "npm-run-all build-css build-js",
     "test": "react-scripts test --env=jsdom",
     "eject": "react-scripts eject"
   },
@@ -14,6 +18,7 @@
     "bootstrap": "^4.1.3",
     "jquery": "^3.3.1",
     "node-sass-chokidar": "^1.3.3",
+    "npm-run-all": "^4.1.3",
     "popper.js": "^1.14.4",
     "react": "^16.5.2",
     "react-dom": "^16.5.2",

package.json

@@ -1,13 +1,12 @@
 import React, { Component } from 'react';
-import logo from './logo.svg';
-import './App.css';
+import './styles/Universe.css';
+import './styles/App.css';
 
 class App extends Component {
   render() {
     return (
       <div className="App">
         <header className="App-header">
-          <img src={logo} className="App-logo" alt="logo" />
           <h1 className="App-title">Welcome to React</h1>
         </header>
         <p className="App-intro">

src/App.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
-import './index.css';
+import './styles/Universe.css';
+import './styles/index.css';
 import App from './App';
 import registerServiceWorker from './registerServiceWorker';