resize sprites in Compass
@mixin resize-sprite($map, $sprite, $percent) { | |
$spritePath: sprite-path($map); | |
$spriteWidth: image-width($spritePath); | |
$spriteHeight: image-height($spritePath); | |
$width: image-width(sprite-file($map, $sprite)); | |
$height: image-height(sprite-file($map, $sprite)); | |
@include background-size(ceil($spriteWidth * ($percent/100)) ceil($spriteHeight * ($percent/100))); | |
width: ceil($width*($percent/100)); | |
height: ceil($height*($percent/100)); | |
background-position: 0 floor(nth(sprite-position($map, $sprite), 2) * ($percent/100) ); | |
} |
This comment has been minimized.
This comment has been minimized.
hey, I did extend your implementation, also added files with usage examples: https://gist.github.com/wilkerlucio/6442309 my version has a mixin that resizes all the icons at once, which may be helpful :) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
This comment has been minimized.
Great mixin! But is it somehow possible to recreate all sprite-map classes again automatically for the second size?
I created a question here:
http://stackoverflow.com/questions/14135256/how-to-create-a-sprite-from-a-folder-with-and-without-background-size-using-com