postcss-for-var-in

Loops through vars in a file and expose them trough key value params

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
postcss-for-var-in
311.0.06 years ago6 years agoMinified + gzip package size for postcss-for-var-in in KB

Readme

postcss-for-var-in
Read declarations from a css file (using postcss-import and assign the values to a named variable pair (using postcss-simple-vars), and use them to build selectors.
Given the file colors.css:
:root {
  --deep-sky-blue: #00A5FF;
  --dark-sky-blue: #0071AE;
}

You can use this to create new selectors.
@forVar $key, $value in @import 'colors.css' {
  .background-$(key) {
    background-color: $value;
  }
}

Will produce this file
.background-deep-sky-blue {
    background-color: #00A5FF;
}

.background-dark-sky-blue {
    background-color: #0071AE;
}

Development

Run tests

This project uses postcss-tape to run tests.
npm test