Skip to content

Instantly share code, notes, and snippets.

@mz026

mz026/2x_sprite.scss

Created December 15, 2014 07:34
Show Gist options
  • Save mz026/58c30ff2699a76b35a0d to your computer and use it in GitHub Desktop.
Save mz026/58c30ff2699a76b35a0d to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. mz026 created this gist Dec 15, 2014.
    19 changes: 19 additions & 0 deletions 2x_sprite.scss
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,19 @@
    $buttons2x-sprites: sprite-map('buttons2x/*.png');

    %buttons2x-sprite {
    background-image: sprite-url($buttons2x-sprites);
    }

    @mixin buttons2x-sprite($sprite-name){
    @extend %buttons2x-sprite;
    background-repeat: no-repeat;

    $xpos: (nth(sprite-position($buttons2x-sprites, $sprite-name), 1) / 2);
    $ypos: (nth(sprite-position($buttons2x-sprites, $sprite-name), 2) / 2);
    background-position: $xpos $ypos;

    height: image-height(sprite-file($buttons2x-sprites, $sprite-name)) / 2;
    width: image-width(sprite-file($buttons2x-sprites, $sprite-name)) / 2;

    @include background-size(image-width(sprite-path($buttons2x-sprites))/2 image-height(sprite-path($buttons2x-sprites))/2);
    }