basic jig for SASS-based themed CSS (one bundle per theme)
This commit is contained in:
Matthew Hodgson
parent
b0319ec0f1
commit
bacb284415
77 changed files with 17 additions and 3 deletions
|
|
@ -31,7 +31,7 @@
|
||||||
"build:config": "cpx config.json webapp/",
|
"build:config": "cpx config.json webapp/",
|
||||||
"build:emojione": "cpx \"node_modules/emojione/assets/svg/*\" webapp/emojione/svg/",
|
"build:emojione": "cpx \"node_modules/emojione/assets/svg/*\" webapp/emojione/svg/",
|
||||||
"build:modernizr": "modernizr -c .modernizr.json -d src/vector/modernizr.js",
|
"build:modernizr": "modernizr -c .modernizr.json -d src/vector/modernizr.js",
|
||||||
"build:css": "mkdirp build && catw \"src/skins/vector/css/**/*.css\" -o build/components.css --no-watch",
|
"build:css": "mkdirp build && node-sass --recursive --source-map true --output build \"src/skins/vector/css\"",
|
||||||
"build:compile": "babel --source-maps -d lib src",
|
"build:compile": "babel --source-maps -d lib src",
|
||||||
"build:bundle": "NODE_ENV=production webpack -p --progress",
|
"build:bundle": "NODE_ENV=production webpack -p --progress",
|
||||||
"build:bundle:dev": "webpack --optimize-occurence-order --progress",
|
"build:bundle:dev": "webpack --optimize-occurence-order --progress",
|
||||||
|
|
@ -44,7 +44,7 @@
|
||||||
"start:emojione": "cpx \"node_modules/emojione/assets/svg/*\" webapp/emojione/svg/ -w",
|
"start:emojione": "cpx \"node_modules/emojione/assets/svg/*\" webapp/emojione/svg/ -w",
|
||||||
"start:js": "webpack-dev-server -w --progress",
|
"start:js": "webpack-dev-server -w --progress",
|
||||||
"start:js:prod": "NODE_ENV=production webpack-dev-server -w --progress",
|
"start:js:prod": "NODE_ENV=production webpack-dev-server -w --progress",
|
||||||
"start:skins:css": "mkdirp build && catw \"src/skins/vector/css/**/*.css\" -o build/components.css",
|
"start:skins:css": "mkdirp build && node-sass --recursive --watch --source-map true --output build \"src/skins/vector/css\"",
|
||||||
"start": "node scripts/babelcheck.js && parallelshell \"npm run start:emojione\" \"npm run start:res\" \"npm run start:config\" \"npm run start:js\" \"npm run start:skins:css\"",
|
"start": "node scripts/babelcheck.js && parallelshell \"npm run start:emojione\" \"npm run start:res\" \"npm run start:config\" \"npm run start:js\" \"npm run start:skins:css\"",
|
||||||
"start:prod": "parallelshell \"npm run start:emojione\" \"npm run start:js:prod\" \"npm run start:skins:css\"",
|
"start:prod": "parallelshell \"npm run start:emojione\" \"npm run start:js:prod\" \"npm run start:skins:css\"",
|
||||||
"clean": "rimraf build lib webapp electron/dist",
|
"clean": "rimraf build lib webapp electron/dist",
|
||||||
|
|
@ -113,11 +113,13 @@
|
||||||
"karma-webpack": "^1.7.0",
|
"karma-webpack": "^1.7.0",
|
||||||
"mkdirp": "^0.5.1",
|
"mkdirp": "^0.5.1",
|
||||||
"mocha": "^2.4.5",
|
"mocha": "^2.4.5",
|
||||||
|
"node-sass": "^4.1.1",
|
||||||
"parallelshell": "^1.2.0",
|
"parallelshell": "^1.2.0",
|
||||||
"phantomjs-prebuilt": "^2.1.7",
|
"phantomjs-prebuilt": "^2.1.7",
|
||||||
"react-addons-perf": "^15.4.0",
|
"react-addons-perf": "^15.4.0",
|
||||||
"react-addons-test-utils": "^15.4.0",
|
"react-addons-test-utils": "^15.4.0",
|
||||||
"rimraf": "^2.4.3",
|
"rimraf": "^2.4.3",
|
||||||
|
"sass-loader": "^4.1.1",
|
||||||
"source-map-loader": "^0.1.5",
|
"source-map-loader": "^0.1.5",
|
||||||
"webpack": "^1.12.14",
|
"webpack": "^1.12.14",
|
||||||
"webpack-dev-server": "^1.16.2"
|
"webpack-dev-server": "^1.16.2"
|
||||||
|
|
|
||||||
7
src/skins/vector/css/themes/dark.scss
Normal file
7
src/skins/vector/css/themes/dark.scss
Normal file
|
|
@ -0,0 +1,7 @@
|
||||||
|
// typical text (dark-on-white in light skin)
|
||||||
|
$primary-fg-color: #dddddd;
|
||||||
|
$primary-bg-color: #2d2d2d;
|
||||||
|
|
||||||
|
// button UI (white-on-green in light skin)
|
||||||
|
|
||||||
|
@import "../_components"
|
||||||
4
src/skins/vector/css/themes/light.scss
Normal file
4
src/skins/vector/css/themes/light.scss
Normal file
|
|
@ -0,0 +1,4 @@
|
||||||
|
$primary-fg-color: #454545;
|
||||||
|
$primary-bg-color: #ffffff;
|
||||||
|
|
||||||
|
@import "../_components"
|
||||||
|
|
@ -30,7 +30,7 @@ require('babel-polyfill');
|
||||||
|
|
||||||
// CSS requires: just putting them here for now as CSS is going to be
|
// CSS requires: just putting them here for now as CSS is going to be
|
||||||
// refactored "soon" anyway
|
// refactored "soon" anyway
|
||||||
require('../../build/components.css');
|
require('../../build/themes/light.css');
|
||||||
require('gemini-scrollbar/gemini-scrollbar.css');
|
require('gemini-scrollbar/gemini-scrollbar.css');
|
||||||
require('gfm.css/gfm.css');
|
require('gfm.css/gfm.css');
|
||||||
require('highlight.js/styles/github.css');
|
require('highlight.js/styles/github.css');
|
||||||
|
|
|
||||||
|
|
@ -25,6 +25,7 @@ module.exports = {
|
||||||
{ test: /\.js$/, loader: "babel", include: path.resolve('./src') },
|
{ test: /\.js$/, loader: "babel", include: path.resolve('./src') },
|
||||||
// css-raw-loader loads CSS but doesn't try to treat url()s as require()s
|
// css-raw-loader loads CSS but doesn't try to treat url()s as require()s
|
||||||
{ test: /\.css$/, loader: ExtractTextPlugin.extract("css-raw-loader") },
|
{ test: /\.css$/, loader: ExtractTextPlugin.extract("css-raw-loader") },
|
||||||
|
{ test: /\.scss$/, loaders: ["style-loader", "css-loader?sourceMap", "sass-loader?sourceMap"] },
|
||||||
],
|
],
|
||||||
noParse: [
|
noParse: [
|
||||||
// don't parse the languages within highlight.js. They cause stack
|
// don't parse the languages within highlight.js. They cause stack
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue