PostCSS plugin for annotations based inheritance from other rule sets
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
test
.gitignore
.travis.yml
LICENSE
index.js
package.json
readme.markdown

readme.markdown

postcss-annotation-extend Build Status

PostCSS plugin for annotations based inheritance from other rule sets

Installation

$ npm install postcss-annotation-extend

Example

// Dependencies
var fs = require("fs")
var postcss = require("postcss")
var extend = require("postcss-annotation-extend")

// CSS to be processed
var css = fs.readFileSync("input.css", "utf8")

// Process css
var output = postcss()
  .use(extend({src: css}))
  .process(css)
  .css

Using this input.css:

.base-1 {
  /*
   * @base
   */
  font-size: 12px;
}

.base-2 {
  /*
   * @base
   */
  color: red;
}

.foo {
  /*
   * @extend .base-1, .base-2
   */
   padding: 10px;
}

.bar {
  /*
   * @extend .base-1
   */
   margin: 10px;
}

You will get:

.foo,
.bar {
  /*
   * @base
   */
  font-size: 12px;
}

.foo {
  /*
   * @base
   */
  color: red;
}

.foo {
  /*
   * @extend .base-1, .base-2
   */
   padding: 10px;
}

.bar {
  /*
   * @extend .base-1
   */
   margin: 10px;
}

License

The MIT License (MIT)

Copyright (c) 2014 Masaaki Morishita