Compass mixins for HiDPI (Retina)

mixins.scss

@mixin for-hidpi {
	.hidpi & {
		@content;
	}
	@media  only screen and (-webkit-min-device-pixel-ratio: 2),
			only screen and (   min--moz-device-pixel-ratio: 2),
			only screen and (     -o-min-device-pixel-ratio: 2/1),
			only screen and (        min-device-pixel-ratio: 2),
			only screen and (                min-resolution: 192dpi),
			only screen and (                min-resolution: 2dppx) {
		@content;
	}
}

// https://github.com/AdamBrodzinski/Retina-Sprites-for-Compass
@mixin sprite-bg($name, $sprite, $sprite2x: false) {
	background-image: sprite-url($sprite);
	background-position: sprite-position($sprite, $name);
	background-repeat: no-repeat;
	width: image-width(sprite-file($sprite, $name));
	height: image-height(sprite-file($sprite, $name));

	@if $sprite2x {
		@include for-hidpi {
			background-image: sprite-url($sprite2x);
			$pos: sprite-position($sprite2x, $name);
			background-position: nth($pos, 1) nth($pos, 2) / 2;
			
			// @include background-size(image-width(sprite-file($sprite, $name)) image-height(sprite-file($sprite, $name)));
			@include background-size(ceil(image-width(sprite-path($sprite2x)) / 2) auto);
		}
	}
}

usage.scss

$social-sprite: sprite-map("sprites/socials-lodpi/*.png", $spacing: 1px);
$social-sprite-2x: sprite-map("sprites/socials-hidpi/*.png", $spacing: 2px);

@mixin social-sprite-bg($name) {
	@include sprite-bg($name, $social-sprite, $social-sprite-2x);
}

.test-1 {
	@include social-sprite-bg(facebook);
}