From b16c35dfcab86cf1a0c804f4adcb9b5614664a8c Mon Sep 17 00:00:00 2001
From: orbb1 <orbbmax@gmail.com>
Date: Sat, 6 May 2017 07:46:25 +0200
Subject: [PATCH] implement scss styles

---
 client/app/app.component.js                                   | 2 +-
 client/app/{app.css => app.scss}                              | 0
 client/components/dashboard/dashboard.component.js            | 2 +-
 client/components/dashboard/{dashboard.css => dashboard.scss} | 3 +--
 client/pages/home/home.component.js                           | 1 -
 client/pages/home/home.css                                    | 0
 package.json                                                  | 4 +++-
 webpack.config.js                                             | 2 +-
 8 files changed, 7 insertions(+), 7 deletions(-)
 rename client/app/{app.css => app.scss} (100%)
 rename client/components/dashboard/{dashboard.css => dashboard.scss} (93%)
 delete mode 100644 client/pages/home/home.css

diff --git a/client/app/app.component.js b/client/app/app.component.js
index 9c34bda..6ed050f 100644
--- a/client/app/app.component.js
+++ b/client/app/app.component.js
@@ -1,5 +1,5 @@
 import template from './app.html';
-import './app.css';
+import './app.scss';
 
 let appComponent = {
   template,
diff --git a/client/app/app.css b/client/app/app.scss
similarity index 100%
rename from client/app/app.css
rename to client/app/app.scss
diff --git a/client/components/dashboard/dashboard.component.js b/client/components/dashboard/dashboard.component.js
index ad44d55..62426f3 100644
--- a/client/components/dashboard/dashboard.component.js
+++ b/client/components/dashboard/dashboard.component.js
@@ -1,5 +1,5 @@
 import template from './dashboard.html';
-import './dashboard.css';
+import './dashboard.scss';
 
 let dashboardComponent = {
     template,
diff --git a/client/components/dashboard/dashboard.css b/client/components/dashboard/dashboard.scss
similarity index 93%
rename from client/components/dashboard/dashboard.css
rename to client/components/dashboard/dashboard.scss
index f836ed1..627c48a 100644
--- a/client/components/dashboard/dashboard.css
+++ b/client/components/dashboard/dashboard.scss
@@ -1,5 +1,5 @@
 .Dashboard-Container {
-    background-color: #650359;
+    background-color: black;
     border-radius: 5px;
     box-shadow: 0 0 5px black;
     margin: 10% auto;
@@ -9,7 +9,6 @@
     -webkit-transition: all 1s;
     -moz-transition: all 1s;
     transition: all  1s;
-    -o-transition: all 1s;
 }
 .Dashboard-Header {
     font: 20px Calibri, sans-serif;
diff --git a/client/pages/home/home.component.js b/client/pages/home/home.component.js
index e81bdd6..7af75e2 100644
--- a/client/pages/home/home.component.js
+++ b/client/pages/home/home.component.js
@@ -1,6 +1,5 @@
 import template from './home.html';
 import controller from './home.controller';
-import './home.css';
 
 let homeComponent = {
     template,
diff --git a/client/pages/home/home.css b/client/pages/home/home.css
deleted file mode 100644
index e69de29..0000000
diff --git a/package.json b/package.json
index 13059b9..856e94a 100644
--- a/package.json
+++ b/package.json
@@ -12,8 +12,8 @@
     "angular-mocks": "^1.5.0",
     "babel-core": "^6.7.7",
     "babel-loader": "^6.2.4",
-    "babel-polyfill": "^6.7.4",
     "babel-plugin-transform-runtime": "^6.7.5",
+    "babel-polyfill": "^6.7.4",
     "babel-preset-es2015": "^6.6.0",
     "babel-preset-stage-0": "^6.5.0",
     "babel-register": "^6.7.2",
@@ -40,8 +40,10 @@
     "mocha": "^2.3.0",
     "ng-annotate-loader": "0.0.10",
     "node-libs-browser": "^0.5.0",
+    "node-sass": "^4.5.2",
     "raw-loader": "^0.5.1",
     "run-sequence": "^1.1.0",
+    "sass-loader": "^6.0.3",
     "style-loader": "^0.12.2",
     "stylus": "^0.54.5",
     "stylus-loader": "^2.1.1",
diff --git a/webpack.config.js b/webpack.config.js
index acf5e5e..4f5a4ec 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -9,7 +9,7 @@ module.exports = {
     loaders: [
        { test: /\.js$/, exclude: [/app\/lib/, /node_modules/], loader: 'ng-annotate!babel' },
        { test: /\.html$/, loader: 'raw' },
-       { test: /\.styl$/, loader: 'style!css!stylus' },
+       { test: /\.scss$/, loaders: ["style-loader", "css-loader", "sass-loader"] },
        { test: /\.css$/, loader: 'style!css' }
     ]
   },