Skip to content
Stylecow plugin to work with variables using standard var() function
Branch: master
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.
tests
.gitignore
.travis.yml
LICENSE
README.md
index.js
package.json

README.md

stylecow plugin variables

Build Status

Stylecow plugin to work with variables using the standard var(), available in CSS Custom Properties for Cascading Variables Module Level 1.

For global variables (available in all properties), you have to define them in the selectors :root or html. Use nested rules to create scoped variables.

:root {
    --mycolor: red;
}

.foo {
    color: var(--mycolor);
}

.foo h2 {
    --mycolor: blue;

    color: var(--mycolor);
    font-size: var(--mySize, 24px);
}

And stylecow converts to:

.foo {
    color: red;
}

.foo h2 {
    color: blue;
    font-size: 24px;
}

More demos in the tests folder

You can’t perform that action at this time.