drdk / grunt-dr-svg-sprites

Grunt plugin to create SVG sprites with PNG fallbacks at needed sizes
113 stars 19 forks source link

Wish list: Turn off CSS output and order the images in the sprite in numeric/alphabetic order #5

Closed benfrain closed 10 years ago

benfrain commented 10 years ago

As of 0.2.7 the resultant image sprite is laid out in a seemingly random order (not sure if this is the case or not).

Wish 1:

It would be great if the images within the sprite were laid out (or there was an option to do so) in number/alphabetical order.

The use case here being that users (ok, me) may want to write the background position size using a loop in Sass. E.g.

$sprite: 55px;

// Mixin to produce background position
// ====================================================================
@mixin bgpos($cat, $pos) {
    &.cat_#{$cat} {
        > b {
            background-position: 50% (-($pos*$sprite));
        }
    }
}

Wish 2:

An option to disable CSS output. This would mean that if authors wish to write their own CSS and bypass the automated output they can.

PS. I'm only learning JS at the moment and apologise that I'm not offering any code here to help!

phloe commented 10 years ago

Wish 1: Hmmm, it should be ordered as I added a sort a while back - but I haven't experienced random ordering recently. I'll have to try out with a couple of different setups...

Wish 2: I could of course add something to only output the CSS when options.paths.css is defined... You could also just not use the generated CSS and do whatever you want. But - you would have to mimic the exact way the sprites get laid out - and if the dr-grunt-svg-sprites routine changes your routine should be updated accordingly. I don't think that's a very good scenario :(

benfrain commented 10 years ago

Amazing. Thanks :+1: