diff --git a/src/components/AppHeader/AppHeader.css b/src/components/AppHeader/AppHeader.css index c1406f5d..55b25a48 100644 --- a/src/components/AppHeader/AppHeader.css +++ b/src/components/AppHeader/AppHeader.css @@ -9,9 +9,3 @@ .appBar { background-color: var(--backgroundColor); } - -.createBtn { - position: fixed; - right: 2rem; - top: 3.5rem; -} diff --git a/src/components/AppHeader/AppHeader.js b/src/components/AppHeader/AppHeader.js index bb708810..3f018f5b 100644 --- a/src/components/AppHeader/AppHeader.js +++ b/src/components/AppHeader/AppHeader.js @@ -1,7 +1,7 @@ import React from 'react'; import pluralize from 'pluralize'; import { IndexLink } from 'react-router'; -import { Menu, MenuItem, Button, IconButton } from 'react-toolbox'; +import { Menu, MenuItem } from 'react-toolbox'; import AppBar from 'react-toolbox/lib/app_bar'; import FindBar from '../FindBar/FindBar'; import styles from './AppHeader.css'; @@ -45,45 +45,36 @@ export default class AppHeader extends React.Component { - Dashboard + - - + { + collections.valueSeq().map(collection => + + ) + } + ); } diff --git a/src/index.js b/src/index.js index e7c8ffe1..ba980758 100644 --- a/src/index.js +++ b/src/index.js @@ -1,12 +1,16 @@ import React from 'react'; import { render } from 'react-dom'; import { AppContainer } from 'react-hot-loader'; -import Root from './root'; -import registry from './lib/registry'; import 'file?name=index.html!../example/index.html'; import 'react-toolbox/lib/commons.scss'; +import Root from './root'; +import registry from './lib/registry'; import './index.css'; +if (process.env.NODE_ENV !== 'production') { + require('./utils.css'); // eslint-disable-line +} + // Create mount element dynamically const el = document.createElement('div'); el.id = 'root'; diff --git a/src/utils.css b/src/utils.css new file mode 100644 index 00000000..85da4449 --- /dev/null +++ b/src/utils.css @@ -0,0 +1,25 @@ +/* stylelint-disable */ +/* This is an utility file that should not be included in production build */ +:global { + & .undefined { + position: fixed !important; + top: 0 !important; + right: 0 !important; + bottom: 0 !important; + left: 0 !important; + display: flex !important; + align-items: center !important; + justify-content: center !important; + background: red !important; + color: white !important; + font-weight: bold !important; + font-size: 30px !important; + } + + & .undefined::after { + display: block !important; + padding: 15px 30px !important; + content: 'ERROR! You are missing a class definition in your css module! Inspect me to find out where.' !important; + } +} +/* stylelint-enable */ diff --git a/webpack.base.js b/webpack.base.js index 80a24194..2052d935 100644 --- a/webpack.base.js +++ b/webpack.base.js @@ -1,3 +1,5 @@ +/* eslint global-require: 0 */ + const webpack = require('webpack'); module.exports = { @@ -5,11 +7,11 @@ module.exports = { loaders: [ { test: /\.((png)|(eot)|(woff)|(woff2)|(ttf)|(svg)|(gif))(\?v=\d+\.\d+\.\d+)?$/, - loader: 'url-loader?limit=100000' + loader: 'url-loader?limit=100000', }, { test: /\.json$/, - loader: 'json-loader' + loader: 'json-loader', }, { test: /\.scss$/, @@ -31,15 +33,21 @@ module.exports = { 'transform-object-assign', 'transform-object-rest-spread', 'lodash', - 'react-hot-loader/babel' - ] - } - } - ] + 'react-hot-loader/babel', + ], + }, + }, + ], }, - postcss: [ require('postcss-import')({ addDependencyTo: webpack }), - require('postcss-cssnext') + require('postcss-cssnext'), + ], + plugins: [ + new webpack.DefinePlugin({ + 'process.env': { + NODE_ENV: JSON.stringify(process.env.NODE_ENV), + }, + }), ], };