theme-guideline.md

Guideline to create themes

postcss-style-guide is a PostCSS plugin that generate CSS stye guide automatically.

Developers can set theme of the style guide by option of postcss-style-guide.

var postcss = require('postcss');
var styleGuide = require('postcss-style-guide');
var css = fs.readFileSync('input.css', 'utf-8');

var options = {
  theme: 'forest',
  name: 'project name'
};

postcss()
  .use(styleGuide(options))
  .process(css)
  .css;

Package name

The name of postcss-style-guide theme is must be prefix psg-theme-. The prefix, psg- means postcss-style-guide-.

Ex. psg-theme-forest

How to create themes

Template file name

The template extension of postcss-style-guide must be named template.ejs file and stylesheet is style.css too.

• Template: template.ejs
• Stylesheet: style.css

Set keyword in package.json

Themes of postcss-style-guide must have the psg-theme keyword in their package.json.

Screenshot image for example

You should put a screenshot image for example.

like this: