Skip to content

Instantly share code, notes, and snippets.

@hugeuser
Last active August 29, 2015 13:56
Show Gist options
  • Save hugeuser/9256906 to your computer and use it in GitHub Desktop.
Save hugeuser/9256906 to your computer and use it in GitHub Desktop.
adjustment options
$sprites-spacing: 2px;
@import "sprites/*.png";
//this will create a variable named $sprites-sprites
$sprites_x2-spacing: 4px;
@import "sprites_x2/*.png";
//this will create a variable named $sprites_x2-sprites
@mixin get-sprite( $map, $sprite, $x2: false, $adjustX: 0, $adjustY: 0, $repeat: no-repeat ){
//For use in media queries. Regular @import <dir>-sprite(file-name) does not fully work.
$sprite-image: sprite-file( $map, $sprite );
$sprite-map: sprite-url( $map );
$sprite-position: sprite-position( $map, $sprite );
//return background
background: $sprite-map $sprite-position $repeat;
$div: 1;
@if $x2 == true {
$div: 2;
$map-path: 'generated/'+sprite-path( $map );
@include background-size( ceil( image-width( $map-path )/$div ) auto);
//return position to override above position returned in 'background:'
background-position: nth( $sprite-position, 1 ) ( ( nth($sprite-position, 2 )+( $adjustY*2 ) )/$div );
}
$sprite-width: image-width( $sprite-image );
$sprite-height: image-height( $sprite-image );
//return width
width: ( $sprite-width/$div )+$adjustX;
//return height
height: ( $sprite-height/$div )+$adjustY;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment