Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

postcss-keywords

mindthetic3CC0-1.02.0.0

[![NPM Version][npm-img]][npm-url] [![Build Status][cli-img]][cli-url] [![Support Chat][git-img]][git-url]

postcss, css, postcss-plugin, keywords, custom, values

readme

PostCSS Keywords PostCSS

NPM Version Build Status Support Chat

PostCSS Keywords lets you create custom keywords which can be used in declarations.

@keyword small {
  value: 24px;
  property: padding, margin;
}

@keyword small {
  value: 16px;
  property: font-size;
}

@keyword medium {
  value: 40px;
  property: padding, margin;
}

.example {
  font-size: small;
  padding: small medium;
  margin: small;
}

Outputs:

.example {
  font-size: 16px;
  padding: 24px 40px;
  margin: 24px;
}

Setup

Add it to your project:

npm install postcss-keywords --save-dev

changelog

Changes to PostCSS Keywords

1.0.0 (September 1, 2018)

  • Initial version