rework-variant

Another take on variables in Rework.

npm install rework-variant
15 downloads in the last day
46 downloads in the last week
183 downloads in the last month

Rework Variant

A new take on variables for Rework.

Installation

Install with npm:

npm install rework-variant

Usage

var rework = require('rework');
var variant = require('rework-variant');
rework(txt).use(variant());

Globals

The $globals rule allows variables to be referenced without a prefix:


$globals {
  blue: #2ccdec;
  orange: #f33c27;
}

a {
  color: $blue;
}

a:hover {
  color: $orange;
}

While other variable rules act as namespaces:

$colors {
  blue: #2ccdec;
  orange: #f33c27;
}

a {
  color: $colors.blue;
}

a:hover {
  color: $colors.orange;
}

Variables may be referenced in most places you'd expect:


$globals {
  phone-portrait: (min-device-width: 320px);
  phone-landscape: (min-device-width: 480px);
}

@media screen and $phone-portrait and $phone-landscape {
  body {
    some: 'stuff';
  }
}

License

MIT

npm loves you