PostCSS plugin to make CSS Modules' composes work with any selectors
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.
src
test
.editorconfig
.gitignore
.npmignore
.travis.yml
CHANGELOG.md
LICENSE
README.md
package.json

README.md

PostCSS Composes Build Status

PostCSS plugin to make CSS Modules' composes work with any selectors.

Caution: use at your own risk.

.foo {
  color: red;
}
.bar:hover {
  composes: foo;
}
.foo {
  color: red;
}
.bar:hover {
  color: red;
}

Usage

postcss([ require('postcss-composes') ])

See PostCSS docs for examples for your environment.

Why?

CSS Modules' composes is great but it only works with classes (see: 33, 41, 42, 68 and 80).

For example, the suggested way of composing pseudo-classes with CSS Modules requires the creation of extra classes:

.red {
  color: red;
}
.blue-on-hover:hover {
  color: blue;
}

.foo {
  composes: red blue-on-hover;
}

Credits

Thanks Aaron7 for the idea.