Skip to content

Instantly share code, notes, and snippets.

@anglepoised
Last active February 15, 2016 08:55
Show Gist options
  • Save anglepoised/9f5b1d019f8bc2e5891e to your computer and use it in GitHub Desktop.
Save anglepoised/9f5b1d019f8bc2e5891e to your computer and use it in GitHub Desktop.
postcss-style-guide default theme bug
node_modules/

postcss-style-guide-20160215

Run npm install && npm start to see.

  1. working.html uses psg-theme-1column and creates correct style guide.
  2. broken.html uses default theme (psg-theme-default) and creates styleguide but doesn't add markdown.
{
"use": [
"postcss-style-guide"
],
"input": "src.css",
"output": "dist.css",
"local-plugins": true,
"postcss-style-guide" : {
"dest": "broken.html"
}
}
{
"name": "postcss-style-guide-20160215",
"description": "postcss-style-guide-20160215",
"author": "Paul Love <paul@anglepoised.com>",
"engines": {
"node": ">=5.6.0"
},
"scripts": {
"broken": "postcss --config broken.json",
"working": "postcss --config working.json",
"start": "npm run broken && npm run working"
},
"devDependencies": {
"postcss-cli": "2.3.3",
"postcss-style-guide": "0.13.0",
"psg-theme-1column": "0.4.0"
}
}
/*
@styleguide
@title Button
Use the button classes on and `<a>`, `<button>`, `<input>` elements.
<button class="button button--large button--red">Red Button</button>
<button class="button button--large button--red">Red Button</button>
<button class="button button--large button--blue">Red Button</button>
<button class="button button--large button--blue">Red Button</button>
*/
.button {
display: flex;
align-items: center;
justify-content: center;
border-radius: 6px;
cursor: pointer;
}
.button--large {
width: 140px;
height: 40px;
font-size: 14px;
}
.button--red {
color: #fff;
background-color: red;
}
.button--blue {
color: #fff;
background-color: blue;
}
{
"use": [
"postcss-style-guide"
],
"input": "src.css",
"output": "dist.css",
"local-plugins": true,
"postcss-style-guide" : {
"dest": "working.html",
"theme": "1column"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment