cssdoc
Generating Documentation for CSS with Markdown
What's it ?
Are you starting a new css styleguide, or updating your css in a project?
You need a documentation!
With cssdoc
you can write the documentation in your css files with markdown
, and transform it in
a cool and responsive web page.
Install
npm install cssdoc --save
Usage
Firstly, you have to write the documentation in your css file, like this:
/*---title: Buttonsresume: The buttons pagesection: Default Buttons--- My ``styleguide`` includes two predefined **button** styles, each serving its own semantic purpose. ```example<button type="button" class="button">Default</button><button type="button" class="button button--primary">Primary</button>``` ```html<button type="button" class="button">Default</button><button type="button" class="button button--primary">Primary</button>``` .button { color: #bbb; font-size: 1em;} .button--primary { color: #e34; background: #fff;} */
Then save a file, for example, css/styles.css
with its css.
And run...
var Cssdoc = ; ;
Done! Now go to the build
directory and open the file index.html
in your browser.
Enjoy!
Examples
Here some examples using bootstrap 4
and primercss
only to demonstrate what you can do with cssdoc
.
The mystyleguide
example, is an example of the real purpose of this library, give you a way to document your css style guides.