Jobbird Frontend Styleguide

This is a configuration for the Jobbird Styleguide / Pattern Library. It's main responsibility is to combine all Jobbird styled .scss files into a css file.

Features

• Stylelint standard linting
• BEM Linting
• SMACSS ordering
• Other strict linting options
• PostCSS Autoprefixing and some more postcss transformation.
• CSSnano
• Patternlab
• Astrum
• Browsersync

Requirements

Please use a very revent Node version, not lower than 8.10.0

Just using the styles?

To just use the style, grab it from source/css/style.css. It is however recommended to use the CDN. (TODO: Add details with CDN location)

Development

Make sure all the dependencies are installed with:

npm install

After that, watch the files with:

npm run watch

This whill open up the browser with BrowserSync at http://localhost:3001/ and the Patternlab interface will be visible.

Production build

To build the CSS for production simply do:

npm run build

Patternlab

The Node version of Patternlab is used to present the atomic design elements. https://patternlab.io/

Astrum

This package comes with Astrum, to visually present the Styleguide in a more fashionable way than Patternlab. Astrum is checked in under /astrum and does not need compiling and can run as-is (after npm run build). To run just serve the /astrum folder any way you like it. For example use python -m SimpleHTTPServer.

For production, the astrum folder can be hosted anywhere, just refer to the astrum documentation about MIME-type problems in IIS: https://github.com/NoDivide/astrum