A javascript tool for generating functional css.

genescss.github.io

Installation

npm install genes.css --save-dev

Usage

const genes = require('genes.css');

genes.css(source, output, config);

Documentation

Full documentation coming soon.

Meanwhile, here are some basic examples...

<section class="d:b">
  Section displayed as a block.
</section>

section {
  display: block;
}

<section class="a.d:b">
  Section displayed as a block while active.
</section>

section:active {
  display: block;
}

<section class="d:b@sm">
  Section displayed as a block from small screens up.
</section>

@media (min-width: 30em) {
  section {
    display: block;
  }
}

License

MIT © 2019 Paula Griguță [email protected]