cssdoc

1.0.0 • Public • Published

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: Buttons
resume: The buttons page
section: 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 = require('cssdoc');
 
Cssdoc({
  inputDir: './css',    // directory with the css files
  outputDir: './build'  // directory that will be created the page
});
 

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.

Package Sidebar

Install

npm i cssdoc

Weekly Downloads

2

Version

1.0.0

License

MIT

Last publish

Collaborators

  • expalmer