JLHwung / postcss-ic-unit

Use the ic length unit in CSS

PostCSS IC Unit

PostCSS IC Unit lets you use the ic length unit, following the CSS Values and Units Module specification.

p {
  text-indent: 2ic;
}

.bubble {
  width: calc(8ic + 20px);
}

/* becomes */

p {
  text-indent: 2em;
  text-indent: 2ic;
}

.bubble {
  width: calc(8em + 20px);
  width: calc(8ic + 20px);
}

Usage

Add PostCSS IC Unit to your project:

npm install postcss postcss-ic-unit --save-dev

Use PostCSS IC Unit to process your CSS:

import postcssICUnit from 'postcss-ic-unit';

postcssICUnit.process(YOUR_CSS /*, processOptions, pluginOptions */);

Or use it as a PostCSS plugin:

import postcss from 'postcss';
import postcssICUnit from 'postcss-ic-unit';

postcss([
  postcssICUnit(/* pluginOptions */)
]).process(YOUR_CSS /*, processOptions */);

PostCSS IC Unit runs in all Node environments, with special instructions for:

Node	Webpack	Create React App	Gulp	Grunt

Options

preserve

The preserve option determines whether the original ic declaration should remain in the CSS. By default, the original declaration is preserved.