epiphany/node_modules/@csstools/postcss-ic-unit
2023-12-09 22:48:07 -08:00
..
dist stylelint/eleventy config 2023-12-09 22:48:07 -08:00
CHANGELOG.md stylelint/eleventy config 2023-12-09 22:48:07 -08:00
LICENSE.md stylelint/eleventy config 2023-12-09 22:48:07 -08:00
package.json stylelint/eleventy config 2023-12-09 22:48:07 -08:00
README.md stylelint/eleventy config 2023-12-09 22:48:07 -08:00

PostCSS IC Unit PostCSS Logo

npm version CSS Standard Status Build Status Discord

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;
}

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

See prior work by JLHwung here postcss-ic-unit To ensure long term maintenance and to provide the needed features this plugin was recreated based on JLHwung's work.

Usage

Add PostCSS IC Unit to your project:

npm install postcss @csstools/postcss-ic-unit --save-dev

Use it as a PostCSS plugin:

const postcss = require('postcss');
const postcssIcUnit = require('@csstools/postcss-ic-unit');

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

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

Node PostCSS CLI Webpack Gulp Grunt

Options

preserve

The preserve option determines whether the original source is preserved. By default, it is not preserved.

postcssIcUnit({ preserve: true })
p {
  text-indent: 2ic;
}

/* becomes */

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