From 311b43cf78960dfd08562328ebc69f5f603212ee Mon Sep 17 00:00:00 2001
From: Jake Howard <git@theorangeone.net>
Date: Mon, 16 May 2016 18:20:16 +0100
Subject: [PATCH] Build SCSS logically

---
 package.json                     |  2 ++
 scripts/build-scss.sh            | 19 +++++++++++++------
 theme/static/src/scss/index.scss |  8 +++++---
 3 files changed, 20 insertions(+), 9 deletions(-)

diff --git a/package.json b/package.json
index d2fe2a9..5fe484d 100644
--- a/package.json
+++ b/package.json
@@ -25,6 +25,7 @@
     "underscore": "=1.8.3"
   },
   "devDependencies": {
+    "autoprefixer": "=6.3.6",
     "babel-preset-es2015": "=6.1.18",
     "babel-preset-react": "=6.1.18",
     "babelify": "=7.3.0",
@@ -35,6 +36,7 @@
     "eslint-plugin-react": "=3.4.2",
     "markdown-spellcheck": "=0.10.0",
     "node-sass": "=3.7.0",
+    "postcss-cli": "=2.5.2",
     "sass-lint": "=1.7.0",
     "uglify-js": "=2.6.2"
   }
diff --git a/scripts/build-scss.sh b/scripts/build-scss.sh
index c4ddb05..1d867b2 100644
--- a/scripts/build-scss.sh
+++ b/scripts/build-scss.sh
@@ -2,12 +2,19 @@
 
 set -e
 
-mkdir -p theme/static/src/scss/css
-
-# scss can't import css, so copy them into src dir and change the extension!
-cp node_modules/animate.css/animate.css theme/static/src/scss/css/animate.scss
+if [[ $BUILD_PRODUCTION ]]
+then
+  echo ">>> WARNING: Building in Production Mode!"
+fi
 
+echo ">> Building SCSS..."
 node-sass theme/static/src/scss/index.scss theme/static/build/css/index.css --source-map-embed
 
-# Cleanup
-rm -rf theme/static/src/scss/css
+echo ">> Post-Processing..."
+postcss -u autoprefixer -o theme/static/build/css/index.css theme/static/build/css/index.css
+
+if [[ $BUILD_PRODUCTION ]]
+then
+  echo ">> Compressing CSS..."
+  cleancss -d --s0 -o theme/static/build/css/index.css theme/static/build/css/index.css
+fi
diff --git a/theme/static/src/scss/index.scss b/theme/static/src/scss/index.scss
index 48fc106..77d5884 100644
--- a/theme/static/src/scss/index.scss
+++ b/theme/static/src/scss/index.scss
@@ -5,19 +5,21 @@
 
 /* @end Fonts */
 
+
 /* @group Libraries */
 
 @import "node_modules/bootstrap-sass/assets/stylesheets/_bootstrap";
-@import "css/animate";
+@import "node_modules/animate.css/animate";
 
 /* @end Libraries */
 
 
+/* @group Other Imports */
+
 @import "variables";
 @import "creative/creative";
 
-/* @group Other Imports */
-
 /* @end Other Imports */
 
+
 @import "homepage";