Merge pull request #42 from plone/semantic-less

Semantic less

.gitignore

@@ -19,3 +19,7 @@ dist
 /api/bin/
 /api/parts/
 /api/src/
+api/.Python
+api/include
+api/lib
+api/pip-selfcheck.json

api/Makefile

@@ -9,7 +9,7 @@ all: .installed.cfg
 	bin/buildout
 
 bin/buildout: bin/pip
-	wget https://raw.githubusercontent.com/plone/buildout.coredev/5.1/requirements.txt
+	curl https://raw.githubusercontent.com/plone/buildout.coredev/5.1/requirements.txt -O
 	bin/pip install -r requirements.txt
 	@touch -c $@
 

api/requirements.txt

@@ -1,2 +1,2 @@
 setuptools==33.1.1
-zc.buildout==2.8.0
+zc.buildout==2.9.4

package.json

@@ -24,19 +24,17 @@
     "email": "plone-developers@lists.sourceforge.net"
   },
   "homepage": "https://plone.org",
-  "keywords": ["mosaic"],
+  "keywords": [
+    "mosaic"
+  ],
   "main": "src/server.jsx",
   "scripts": {
-    "test:start":
-      "DEBUG=plone-react:* npm-run-all -ln prestart start & npm-run-all -ln wait-for-frontend",
+    "test:start": "DEBUG=plone-react:* npm-run-all -ln prestart start & npm-run-all -ln wait-for-frontend",
     "start": "NODE_ENV=production npm-run-all run:prod:server",
     "dev": "NODE_ENV=development npm-run-all dev:build",
-    "dev:build":
-      "npm-run-all -ln clear:dist prepare:dev:build i18n:build development",
-    "development":
-      "npm-run-all -ln --parallel build:dev:client build:dev:server run:dev:server",
-    "prepare:dev:build":
-      "universal-webpack --settings ./webpack/universal-webpack-settings.js prepare",
+    "dev:build": "npm-run-all -ln clear:dist prepare:dev:build i18n:build development",
+    "development": "npm-run-all -ln --parallel build:dev:client build:dev:server run:dev:server",
+    "prepare:dev:build": "universal-webpack --settings ./webpack/universal-webpack-settings.js prepare",
     "build:dev:client": "better-npm-run run_dev_client",
     "build:dev:server": "better-npm-run build_dev_server",
     "run:dev:server": "better-npm-run run_dev_server",
@@ -51,20 +49,16 @@
     "jsdoc:api": "jsdoc -c jsdoc.api.json; : 'ignore minor errors'",
     "lint": "eslint -c .eslintrc src",
     "lint:fix": "eslint -c .eslintrc src --fix",
-    "prettier":
-      "prettier -l --single-quote --trailing-comma all 'src/**/*.js' 'src/**/*.jsx'",
-    "prettier:fix":
-      "prettier --write --single-quote --trailing-comma all 'src/**/*.js' 'src/**/*.jsx'",
+    "prettier": "prettier -l --single-quote --trailing-comma all 'src/**/*.js' 'src/**/*.jsx'",
+    "prettier:fix": "prettier --write --single-quote --trailing-comma all 'src/**/*.js' 'src/**/*.jsx'",
     "flow": "./node_modules/flow-bin/cli.js",
     "watch:test:unit": "better-npm-run watch_test_unit",
     "test": "npm-run-all prettier lint flow test:unit",
     "test:unit": "better-npm-run test_unit",
-    "coverage":
-      "npm-run-all test && cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js",
+    "coverage": "npm-run-all test && cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js",
     "pretest:e2e": "npm-run-all webdriver-update wait-for-frontend",
     "test:e2e": "protractor ./protractor.conf.js",
-    "wait-for-frontend":
-      "wget --retry-connrefused --spider ${PROTRACTOR_URL:-http://localhost:4300}",
+    "wait-for-frontend": "wget --retry-connrefused --spider ${PROTRACTOR_URL:-http://localhost:4300}",
     "webdriver-update": "webdriver-manager update",
     "docs": "raml2html docs/api/index.raml > src/static/docs/index.html",
     "i18n": "npm-run-all i18n:sync i18n:build",
@@ -99,25 +93,21 @@
       }
     },
     "build_dev_server": {
-      "command":
-        "webpack --config ./webpack/webpack.config.server.dev.entry.js --watch --hot --colors --display-error-details"
+      "command": "webpack --config ./webpack/webpack.config.server.dev.entry.js --watch --hot --colors --display-error-details"
     },
     "run_dev_server": {
-      "command":
-        "nodemon --watch ./src/server.jsx --watch ./src --watch ./dist/server.js ./src/start-server.js --exec babel-node",
+      "command": "nodemon --watch ./src/server.jsx --watch ./src --watch ./dist/server.js ./src/start-server.js --exec babel-node",
       "env": {
         "PORT": 4300,
         "DEBUG": "plone-react:*",
         "DEBUG_LEVELS": "trace"
       }
     },
     "build_prod_client": {
-      "command":
-        "webpack --colors --display-error-details --config ./webpack/webpack.config.client.prod.entry.js"
+      "command": "webpack --colors --display-error-details --config ./webpack/webpack.config.client.prod.entry.js"
     },
     "build_prod_server": {
-      "command":
-        "webpack --colors --display-error-details --config ./webpack/webpack.config.server.prod.entry.js"
+      "command": "webpack --colors --display-error-details --config ./webpack/webpack.config.server.prod.entry.js"
     },
     "run_prod_server": {
       "command": "./node_modules/.bin/babel-node ./src/start-server-prod.js",
@@ -152,7 +142,7 @@
     "debug-logger": "0.4.1",
     "diff": "3.3.1",
     "draft-js": "0.10.2",
-    "draft-js-editor": "1.10.0",
+    "draft-js-editor": "1.11.0",
     "draft-js-export-html": "1.2.0",
     "es6-error": "4.0.2",
     "eslint-plugin-prettier": "2.3.1",
@@ -193,7 +183,7 @@
     "react-dnd": "2.5.1",
     "react-dnd-html5-backend": "2.5.1",
     "react-dom": "15.6.1",
-    "react-dropzone": "4.1.2",
+    "react-dropzone": "4.1.3",
     "react-helmet": "5.2.0",
     "react-inline-css": "2.3.1",
     "react-intl": "2.4.0",
@@ -206,6 +196,7 @@
     "redux-logger": "3.0.6",
     "redux-mock-store": "1.3.0",
     "redux-thunk": "2.2.0",
+    "semantic-ui-less": "^2.2.10",
     "semantic-ui-react": "0.73.1",
     "serialize-javascript": "1.4.0",
     "serve-favicon": "2.4.4",
@@ -216,7 +207,7 @@
     "url-loader": "0.5.9",
     "uuid": "3.1.0",
     "warning": "3.0.0",
-    "webpack": "2.4.1"
+    "webpack": "3.6.0"
   },
   "devDependencies": {
     "autoprefixer-loader": "3.2.0",

src/client.jsx

@@ -22,6 +22,8 @@ const history = syncHistoryWithStore(browserHistory, store);
 addLocaleData([...nlLocaleData, ...deLocaleData, ...enLocaleData]);
 persistAuthToken(store);
 
+import 'semantic-ui-less/semantic.less';
+
 render(
   <Provider store={store} key="provider">
     <Router

src/helpers/Html/Html.jsx

@@ -51,13 +51,6 @@ const Html = ({ assets, component, store }) => {
             charSet="UTF-8"
           />
         ))}
-        <link
-          href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.10/semantic.min.css"
-          media="screen, projection"
-          rel="stylesheet"
-          type="text/css"
-          charSet="UTF-8"
-        />
         <link
           href="/assets/overrides.css"
           media="screen, projection"

src/helpers/Html/__snapshots__/Html.test.jsx.snap

@@ -25,13 +25,6 @@ exports[`Html renders a html component 1`] = `
       rel="stylesheet"
       type="text/css"
     />
-    <link
-      charSet="UTF-8"
-      href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.10/semantic.min.css"
-      media="screen, projection"
-      rel="stylesheet"
-      type="text/css"
-    />
     <link
       charSet="UTF-8"
       href="/assets/overrides.css"

theme/theme.config

@@ -0,0 +1,93 @@
+/*
+
+████████╗██╗  ██╗███████╗███╗   ███╗███████╗███████╗
+╚══██╔══╝██║  ██║██╔════╝████╗ ████║██╔════╝██╔════╝
+   ██║   ███████║█████╗  ██╔████╔██║█████╗  ███████╗
+   ██║   ██╔══██║██╔══╝  ██║╚██╔╝██║██╔══╝  ╚════██║
+   ██║   ██║  ██║███████╗██║ ╚═╝ ██║███████╗███████║
+   ╚═╝   ╚═╝  ╚═╝╚══════╝╚═╝     ╚═╝╚══════╝╚══════╝
+
+*/
+
+/*******************************
+        Theme Selection
+*******************************/
+
+/* To override a theme for an individual element
+   specify theme name below
+*/
+
+/* Global */
+@site       : 'default';
+@reset      : 'default';
+
+/* Elements */
+@button     : 'default';
+@container  : 'default';
+@divider    : 'default';
+@flag       : 'default';
+@header     : 'default';
+@icon       : 'default';
+@image      : 'default';
+@input      : 'default';
+@label      : 'default';
+@list       : 'default';
+@loader     : 'default';
+@rail       : 'default';
+@reveal     : 'default';
+@segment    : 'default';
+@step       : 'default';
+
+/* Collections */
+@breadcrumb : 'default';
+@form       : 'default';
+@grid       : 'default';
+@menu       : 'default';
+@message    : 'default';
+@table      : 'default';
+
+/* Modules */
+@accordion  : 'default';
+@checkbox   : 'default';
+@dimmer     : 'default';
+@dropdown   : 'default';
+@embed      : 'default';
+@modal      : 'default';
+@nag        : 'default';
+@popup      : 'default';
+@progress   : 'default';
+@rating     : 'default';
+@search     : 'default';
+@shape      : 'default';
+@sidebar    : 'default';
+@sticky     : 'default';
+@tab        : 'default';
+@transition : 'default';
+
+/* Views */
+@ad         : 'default';
+@card       : 'default';
+@comment    : 'default';
+@feed       : 'default';
+@item       : 'default';
+@statistic  : 'default';
+
+/*******************************
+            Folders
+*******************************/
+
+/* Path to theme packages */
+@themesFolder : 'themes';
+
+/* Path to site override folder */
+@siteFolder  : "../../theme";
+
+
+/*******************************
+         Import Theme
+*******************************/
+
+@import "~semantic-ui-less/theme.less";
+@fontPath : "../../../themes/@{theme}/assets/fonts";
+
+/* End Config */

webpack/webpack.config.dev.js

@@ -3,6 +3,8 @@ import webpack from 'webpack';
 import CaseSensitivePathsPlugin from 'case-sensitive-paths-webpack-plugin';
 import CopyWebpackPlugin from 'copy-webpack-plugin';
 import fs from 'fs';
+import ExtractTextPlugin from 'extract-text-webpack-plugin';
+
 
 const projectRootPath = path.resolve(__dirname, '../');
 
@@ -62,10 +64,8 @@ reactTransform[1].transforms.push({
 const BASE_CSS_LOADER = {
   loader: 'css-loader',
   options: {
-    modules: true,
     importLoaders: 2,
     sourceMap: true,
-    '-minimize': true,
     localIdentName: '[name]__[local]___[hash:base64:5]'
   }
 };
@@ -146,15 +146,12 @@ module.exports = {
         ]
       },
       {
-        test: /\.(woff|woff2|ttf|eot|svg|png|gif|jpg)(\?v=\d+\.\d+\.\d+)?$/,
-        use: [
-          {
-            loader: 'url-loader',
-            options: {
-              limit: 10000
-            }
-          }
-        ]
+        test: /\.jpe?g$|\.gif$|\.png$|\.ttf$|\.eot$|\.svg$/,
+        use: 'file-loader?name=[name].[ext]?[hash]'
+      },
+      {
+        test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
+        loader: 'url-loader?limit=10000&mimetype=application/fontwoff'
       }
     ],
   },
@@ -164,6 +161,9 @@ module.exports = {
       'node_modules',
     ],
     extensions: ['.json', '.js', '.jsx'],
+    alias: {
+      '../../theme.config$': path.join(__dirname, '../theme/theme.config')
+    }
   },
   plugins: [
     new webpack.HotModuleReplacementPlugin(),

webpack/webpack.config.prod.js

@@ -9,10 +9,8 @@ const assetsPath = path.resolve(projectRootPath, './dist');
 const BASE_CSS_LOADER = {
   loader: 'css-loader',
   options: {
-    modules: true,
     importLoaders: 2,
     sourceMap: true,
-    '-minimize': true,
     localIdentName: '[name]__[local]___[hash:base64:5]'
   }
 };
@@ -92,15 +90,12 @@ module.exports = {
         ]
       },
       {
-        test: /\.(woff|woff2|ttf|eot|svg|png|gif|jpg)(\?v=\d+\.\d+\.\d+)?$/,
-        use: [
-          {
-            loader: 'url-loader',
-            options: {
-              limit: 10000
-            }
-          }
-        ]
+        test: /\.jpe?g$|\.gif$|\.png$|\.ttf$|\.eot$|\.svg$/,
+        use: 'file-loader?name=[name].[ext]?[hash]'
+      },
+      {
+        test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
+        loader: 'url-loader?limit=10000&mimetype=application/fontwoff'
       }
     ]
   },