This is a skeleton for building a living stylguide with Brunch and KSS (using kss-node).
The skeleton features:
- A living style guide with kss-node
- SCSS / JS support
- BrowserSync integration (live reload)
- An improved kss-node theme
- A sample type component to get you started
Clone this repo manually or run:
brunch new -s gh:fakeller/kss-brunch-seed
- Install (if you don't have them):
- Node.js
- Brunch, required plugins, and app dependencies:
npm install
oryarn install
- Run:
npm start
oryarn start
โ watches the project with continuous rebuild and BrowserSync.npm run build
oryarn run build
โ builds minified project for production
- Learn:
public/
dir is fully auto-generated and served by BrowserSync.app/
dir contains all SCSS / JS / assets that make up the living style guidestyleguide/
dir allows to customize the style guide itself- kss-brunch plugin can configure the generated living style guide
- kss-node generates the living style guide and documents all available options
- Brunch site, Getting started guide
The style guide skeleton contains an improved kss-node theme with improved readability and space-usage. It also has some improved documentation features.
Hints:
Place a markdown blockquote
in a KSS description and the blockquote will be rendered as a highlighted hint for additional information and context. For example:
/*
Alignment
Easily realign text to components with text alignment classes.
> # Hint:
> These controls are too fine granular. Please use a more abstract element to control text flow, if possible.
Markup:
...
*/
The license is public domain. Use it however you want.
Project created and maintained by Fabian Keller.