Generate Sass Map

[mikestreety]

Before i dive in - fantastic plugin - works wonders!

---

I have had a hack about with the project and got it to generate a Sass map instead of CSS classes. With a mixin, I was then able to have full control over all the attributes exported and where they were put.

As it is a custom hack, i have stripped out a lot of the code - but here is our working example:

https://github.com/liquidlight/gulp-svg-sprites/blob/master/lib/css-render.js

It generates code like:

$icons: (
    sprite: (width: 2395px, height: 61px, pngPath: '../img/sprite.png', svgPath: '../img/sprite.svg'),
    arrowLgBlack: (width: 24px, height: 23px, backgroundX: -0px, backgroundY: 0),
    arrowLgGreen: (width: 24px, height: 23px, backgroundX: -30px, backgroundY: 0),
    arrowLgRed: (width: 24px, height: 23px, backgroundX: -60px, backgroundY: 0)
);

This means in my Sass (with help from a mixin) I can do:

.class {
    @include sprite(arrowLgRed);
}

---

I am not a node developer, and ave probably employed several bad practices - would be great if something like this could be implemented.

[shakyShane]

This plugin is being re-written from scratch - when it's finished, you'll be able to provide your own templates for rendering the data :)

[mikestreety]

Ah excellent! Thats fantastic news. Do you have an eta of any sort? I appreciate its an as and when kind of thing!

For now, i've published my re-write (with a link to yours of course) so I can use it on a couple of projects, but will take it down once yours is complete.

Thanks mate - cracking work :)

[shakyShane]

I might get it done this weekend :)

The idea is that the plugin will only return the data - the templates will be handled in user-land :)