Skip to content

Instantly share code, notes, and snippets.

@giuliandrimba
Created August 29, 2014 17:57
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save giuliandrimba/2fcc2a6dfbd5497bba4f to your computer and use it in GitHub Desktop.
Save giuliandrimba/2fcc2a6dfbd5497bba4f to your computer and use it in GitHub Desktop.
SASS + Compass retina sprite mixin
@mixin get-sprite($imgs, $name, $resize : false)
{
$dimensions: true !default;
$clean-up: true !default;
$layout:vertical !default;
$map: sprite-map($imgs, $layout: $layout, $cleanup: $clean-up, $spacing: 15px);
background: $map no-repeat;
@include sprite($map, $name, $dimensions, 0, 0);
width: image-width(sprite-file($map, $name));
height: image-height(sprite-file($map, $name));
@if $resize
{
$ypos: round(nth(sprite-position($map, $name), 2) / 2);
background-position: 0 $ypos;
width: ceil(image-width(sprite-file($map, $name)) / 2);
height: ceil(image-height(sprite-file($map, $name)) / 2);
$sprites-width: ceil(image-width(sprite-path($map)) / 2);
$sprites-height: ceil(image-height(sprite-path($map)) / 2);
background-size: $sprites-width $sprites-height;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment