nav tabs on admin dashboard

node_modules/postcss/README.md

@@ -26,10 +26,11 @@ e.g. to find errors automatically insert vendor prefixes.
 **中文翻译**:              [`README-cn.md`](./README-cn.md)
 
 For PostCSS commercial support (consulting, improving the front-end culture
-of your company, PostCSS plugins), contact [Evil Martians](https://evilmartians.com/?utm_source=postcss)
+of your company, PostCSS plugins), contact [Evil Martians]
 at <surrender@evilmartians.com>.
 
 [Abstract Syntax Tree]: https://en.wikipedia.org/wiki/Abstract_syntax_tree
+[Evil Martians]:        https://evilmartians.com/?utm_source=postcss
 [Autoprefixer]:         https://github.com/postcss/autoprefixer
 [plugins]:              https://github.com/postcss/postcss#plugins
 
@@ -193,28 +194,28 @@ Use [`postcss-loader`] in `webpack.config.js`:
 
 ```js
 module.exports = {
-    module: {
-        rules: [
-            {
-                test: /\.css$/,
-                exclude: /node_modules/,
-                use: [
-                    {
-                        loader: 'style-loader',
-                    },
-                    {
-                        loader: 'css-loader',
-                        options: {
-                            importLoaders: 1,
-                        }
-                    },
-                    {
-                        loader: 'postcss-loader'
-                    }
-                ]
+  module: {
+    rules: [
+      {
+        test: /\.css$/,
+        exclude: /node_modules/,
+        use: [
+          {
+            loader: 'style-loader',
+          },
+          {
+            loader: 'css-loader',
+            options: {
+              importLoaders: 1,
             }
+          },
+          {
+            loader: 'postcss-loader'
+          }
         ]
-    }
+      }
+    ]
+  }
 }
 ```
 
@@ -222,30 +223,65 @@ Then create `postcss.config.js`:
 
 ```js
 module.exports = {
-    plugins: [
-        require('precss'),
-        require('autoprefixer')
-    ]
+  plugins: [
+    require('precss'),
+    require('autoprefixer')
+  ]
 }
 ```
 
 [`postcss-loader`]: https://github.com/postcss/postcss-loader
 
+### CSS-in-JS
+
+The best way to use PostCSS with CSS-in-JS is [`astroturf`].
+Add its loader to your `webpack.config.js`:
+
+```js
+module.exports = {
+  module: {
+    rules: [
+      {
+        test: /\.css$/,
+        use: ['style-loader', 'postcss-loader'],
+      },
+      {
+        test: /\.jsx?$/,
+        use: ['babel-loader', 'astroturf/loader'],
+      }
+    ]
+  }
+}
+```
+
+Then create `postcss.config.js`:
+
+```js
+module.exports = {
+  plugins: [
+    require('autoprefixer'),
+    require('postcss-nested')
+  ]
+}
+```
+
+[`astroturf`]: https://github.com/4Catalyzer/astroturf
+
 ### Gulp
 
 Use [`gulp-postcss`] and [`gulp-sourcemaps`].
 
 ```js
-gulp.task('css', function () {
-    var postcss    = require('gulp-postcss');
-    var sourcemaps = require('gulp-sourcemaps');
+gulp.task('css', () => {
+  const postcss    = require('gulp-postcss')
+  const sourcemaps = require('gulp-sourcemaps')
 
-    return gulp.src('src/**/*.css')
-        .pipe( sourcemaps.init() )
-        .pipe( postcss([ require('precss'), require('autoprefixer') ]) )
-        .pipe( sourcemaps.write('.') )
-        .pipe( gulp.dest('build/') );
-});
+  return gulp.src('src/**/*.css')
+    .pipe( sourcemaps.init() )
+    .pipe( postcss([ require('precss'), require('autoprefixer') ]) )
+    .pipe( sourcemaps.write('.') )
+    .pipe( gulp.dest('build/') )
+})
 ```
 
 [`gulp-sourcemaps`]: https://github.com/floridoo/gulp-sourcemaps
@@ -272,10 +308,10 @@ To apply PostCSS plugins to React Inline Styles, JSS, Radium
 and other [CSS-in-JS], you can use [`postcss-js`] and transforms style objects.
 
 ```js
-var postcss  = require('postcss-js');
-var prefixer = postcss.sync([ require('autoprefixer') ]);
+var postcss  = require('postcss-js')
+var prefixer = postcss.sync([ require('autoprefixer') ])
 
-prefixer({ display: 'flex' }); //=> { display: ['-webkit-box', '-webkit-flex', '-ms-flexbox', 'flex'] }
+prefixer({ display: 'flex' }) //=> { display: ['-webkit-box', '-webkit-flex', '-ms-flexbox', 'flex'] }
 ```
 
 [`postcss-js`]: https://github.com/postcss/postcss-js
@@ -302,21 +338,21 @@ prefixer({ display: 'flex' }); //=> { display: ['-webkit-box', '-webkit-flex', '
 For other environments, you can use the JS API:
 
 ```js
-const fs = require('fs');
-const postcss = require('postcss');
-const precss = require('precss');
-const autoprefixer = require('autoprefixer');
+const autoprefixer = require('autoprefixer')
+const postcss = require('postcss')
+const precss = require('precss')
+const fs = require('fs')
 
 fs.readFile('src/app.css', (err, css) => {
-    postcss([precss, autoprefixer])
-        .process(css, { from: 'src/app.css', to: 'dest/app.css' })
-        .then(result => {
-            fs.writeFile('dest/app.css', result.css, () => true);
-            if ( result.map ) {
-                fs.writeFile('dest/app.css.map', result.map, () => true);
-            }
-        });
-});
+  postcss([precss, autoprefixer])
+    .process(css, { from: 'src/app.css', to: 'dest/app.css' })
+    .then(result => {
+      fs.writeFile('dest/app.css', result.css, () => true)
+      if ( result.map ) {
+        fs.writeFile('dest/app.css.map', result.map, () => true)
+      }
+    })
+})
 ```
 
 Read the [PostCSS API documentation] for more details about the JS API.
@@ -346,6 +382,24 @@ Common options:
 [Midas]:              https://github.com/ben-eb/midas
 [SCSS]:               https://github.com/postcss/postcss-scss
 
+### Treat Warnings as Errors
+
+In some situations it might be helpful to fail the build on any warning
+from PostCSS or one of its plugins. This guarantees that no warnings
+go unnoticed, and helps to avoid bugs. While there is no option to enable
+treating warnings as errors, it can easily be done
+by adding `postcss-fail-on-warn` plugin in the end of PostCSS plugins:
+
+```js
+module.exports = {
+  plugins: [
+    require('autoprefixer'),
+    require('postcss-fail-on-warn')
+  ]
+}
+```
+
+
 ## Editors & IDE Integration
 
 ### Atom