postcss-map icon indicating copy to clipboard operation
postcss-map copied to clipboard

Iterating through map items

Open bpaugam opened this issue 8 years ago • 11 comments

I'm trying to iterate through a map of colorschemes defined in a yaml file to achieve something like this:

# theme.yml
schemes:
    - green:
        color: '#00FF00'
        text: '#FFFFFF'
    - blue:
        color: '#0000FF'
        text: '#FFFFFF'
    - red:
        color: '#FF0000'
        text: '#FFFFFF'
// Before transpilation
@each $schemeName, $scheme in map(theme, schemes) {
    .$schemeName {
        background-color: $scheme['color'];
        color: $scheme['text'];
    }
}

// After transpilation (desired result)
.green {
    background-color: #00FF00;
    color: #FFFFFF;
}
.blue {
    background-color: #0000FF;
    color: #FFFFFF;
}
.red {
    background-color: #FF0000;
    color: #FFFFFF;
}

Is there any way of achieving this result with postcss-map ? Or am I gravely mistaken and should move to another plugin ?

bpaugam avatar May 14 '16 02:05 bpaugam