postcss-meter v1.0.0

postcss-meter

Cross-browser meter pseudo-selectors

Installation

$ npm install --save-dev postcss-meter

Usage

See postcss/postss for usage information on postcss itself.

const postcss = require('postcss');
const meter = require('postcss-meter');

postcss(meter).process(css)

Options

keepOriginal (default: false)

Whether to keep the original selector, too.

Example: {keepOriginal: false} (default)

::meter-bar {
  color: green;
}

::-moz-meter-bar {
  color: green;
}

::-webkit-meter-optimum-value,::-webkit-meter-suboptimum-value,::-webkit-meter-even-less-good-value {
  color: green;
}

Example: {keepOriginal: true}

::meter-bar {
  color: green;
}

/* this block would be removed if keepOriginal were false */
::meter-bar {
  color: green;
}

::-moz-meter-bar {
  color: green;
}

::-webkit-meter-optimum-value,::-webkit-meter-suboptimum-value,::-webkit-meter-even-less-good-value {
  color: green;
}

vendors (default: ['moz', 'webkit'])

For which vendors to "prefix" the pseudo-selectors. Note that only the default vendors are supported. Edge uses the same selectors as WebKit, so the value 'webkit' also supports Edge.

Example: {vendors: ['moz', 'webkit']} (default)

::meter-bar {
  color: green;
}

/* this block would not be here if moz weren't in vendors */
::-moz-meter-bar {
  color: green;
}

/* this block would not be here if webkit weren't in vendors */
::-webkit-meter-optimum-value,::-webkit-meter-suboptimum-value,::-webkit-meter-even-less-good-value {
  color: green;
}

Example: {vendors: ['moz']}

::meter-bar {
  color: green;
}

::-moz-meter-bar {
  color: green;
}

/* webkit-block isn't here */

Example: {vendors: ['webkit']}

::meter-bar {
  color: green;
}

/* moz-block isn't here */

::-webkit-meter-optimum-value,::-webkit-meter-suboptimum-value,::-webkit-meter-even-less-good-value {
  color: green;
}

License

MIT © Malte-Maurice Dreyer