PostCSS Seldon

(work in progress)

PostCSS plugin to collect documentation from structured comments in CSS. postcss-seldon attaches an object, docs, to the postcss result. Nothing more, nothing less.

Use this plugin with your favorite templating language to generate CSS documentation.

Structured documentation comments

Add structured documentation comments and postcss-seldon will provide an object representing all comments found in your CSS.

Documentation comments begin with /**doc and a newline, followed by yaml frontmatter. There are no required yaml properties; use whatever will work best for your documentation use case. Following the frontmatter, you can use github-flavored markdown.

/**doc
---
title: My Cool Class
foo: bar
keywords:
  - valid
  - yaml
  - here
---

# This is markdown

*/
.foo {
    /* Input example */
}

result.doc

[
  {
    meta: {
      title: 'My Cool Class',
      foo: 'bar',
      keywords: ['valid', 'yaml', 'here']
    },
    markdown: "# This is markdown",
    html: "<h1>This is markdown</h1>"
  }
]

Usage

postcss([ require('postcss-seldon') ])
  .then(result => {
    // `result.doc` contains documentation extracted from CSS
  })

See PostCSS docs for examples for your environment.

This project was inspired by hologram. In Isaac Asimov's Foundation trilogy, Hari Seldon is a character that appears only in hologram form.