Permalink
Browse files

added retina-image mixin

  • Loading branch information...
1 parent 6e69474 commit 58fa7d4ab7ec291eb4fe745375db521b1743df02 Phil LaPier committed Dec 21, 2012
Showing with 15 additions and 0 deletions.
  1. +1 −0 app/assets/stylesheets/_bourbon.scss
  2. +14 −0 app/assets/stylesheets/addons/_retina-image.scss
@@ -40,6 +40,7 @@
@import "addons/html5-input-types";
@import "addons/position";
@import "addons/prefixer";
+@import "addons/retina-image";
@import "addons/size";
@import "addons/timing-functions";
@import "addons/triangle";
@@ -0,0 +1,14 @@
+@mixin retina-image($filename, $image-width, $image-height, $extension: ".png") {
+ background-image: url($filename + $extension);
+ height: $image-height;
+ width: $image-width;
+
+ @media (min--moz-device-pixel-ratio: 1.3),
+ (-o-min-device-pixel-ratio: 2.6/2),
+ (-webkit-min-device-pixel-ratio: 1.3),
+ (min-device-pixel-ratio: 1.3),
+ (min-resolution: 1.3dppx) {
+ background-image: url($filename + "@2x" + $extension);
+ background-size: $image-width $image-height;
+ }
+}

0 comments on commit 58fa7d4

Please sign in to comment.