Reflect uppy.css dist changes in website

bin/build-css

@@ -9,4 +9,5 @@ __dir="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
 __file="${__dir}/$(basename "${BASH_SOURCE[0]}")"
 __base="$(basename ${__file} .sh)"
 
-node_modules/.bin/node-sass src/scss/index.scss -o dist/uppy.css
+node_modules/.bin/node-sass src/scss/ \
+  --output dist/

package.json

@@ -14,9 +14,10 @@
     "server": "browser-sync start --config .browsersync.js",
     "test:phantom": "zuul test/spec/upload.js --phantom",
     "test": "bin/test",
-    "watch:css": "nodemon -e src/scss -x \"npm run build:css\"",
+    "watch": "nodemon --watch src --ext scss,js -x \"npm run build && node website/update.js\"",
+    "watch:css": "nodemon --watch src --ext scss -x \"npm run build && node website/update.js\"",
     "watch:examples": "cd website && node build-examples.js watch",
-    "watch:js": "nodemon --watch src -e js --ignore src/scss -x \"npm run build && node website/update.js\"",
+    "watch:js": "nodemon --watch src --ext js -x \"npm run build && node website/update.js\"",
     "web:clean": "cd website && ./node_modules/.bin/hexo clean",
     "web:build": "cd website && node update.js && ./node_modules/.bin/hexo generate",
     "web:deploy": "npm run web:install && npm run web:build && ./bin/web-deploy",

src/core/Transloadit.scss

@@ -1,6 +0,0 @@
-.uppy {
-  font-family : "Comic Sans MS";
-  color       : purple;
-  border      : 1px dashed pink;
-  font-size   : 32px;
-}

website/themes/uppy/source/css/uppy.css

@@ -0,0 +1,39 @@
+.uppy {
+  font-family: "Comic Sans MS";
+  color: purple;
+  border: 1px dashed pink;
+  font-size: 32px; }
+
+/**
+* Drag & Drop
+*/
+.UppyDragDrop {
+  width: 300px;
+  text-align: center;
+  padding: 100px 10px; }
+
+/* http://tympanus.net/codrops/2015/09/15/styling-customizing-file-inputs-smart-way/ */
+.UppyDragDrop-input {
+  width: 0.1px;
+  height: 0.1px;
+  opacity: 0;
+  overflow: hidden;
+  position: absolute;
+  z-index: -1; }
+
+.UppyDragDrop.is-dragdrop-supported {
+  border: 2px dashed;
+  border-color: #ccc; }
+
+.UppyDragDrop-label {
+  cursor: pointer; }
+
+.UppyDragDrop-dragText {
+  display: none; }
+
+.is-dragdrop-supported .UppyDragDrop-dragText {
+  display: inline; }
+
+.UppyDragDrop.is-dragover {
+  border-color: #d2ecea;
+  background-color: #dbf5f3; }

website/update.js

@@ -14,7 +14,8 @@ var sizes     = {};
 var locations = {
   min: uppyRoot + '/dist/uppy.js',
   gz : uppyRoot + '/dist/uppy.js',
-  dev: uppyRoot + '/dist/uppy.js'
+  dev: uppyRoot + '/dist/uppy.js',
+  css: uppyRoot + '/dist/uppy.css'
 }
 // @todo: ^-- Refer to actual minified builds in dist:
 
@@ -37,5 +38,11 @@ fs.writeFileSync(
   webRoot + '/themes/uppy/source/js/uppy.js',
   fs.readFileSync(locations.dev, 'utf-8')
 );
+console.info(chalk.green('✓ injected: '), chalk.dim('uppy.js build into site'));
 
-console.info(chalk.green('✓ injected: '), chalk.dim('uppy build into site'));
+
+fs.writeFileSync(
+  webRoot + '/themes/uppy/source/css/uppy.css',
+  fs.readFileSync(locations.css, 'utf-8')
+);
+console.info(chalk.green('✓ injected: '), chalk.dim('uppy.css build into site'));