From: Chris Rebert <code@chrisrebert.com>
Date: Fri, 30 Oct 2015 00:33:21 +0000 (-0700)
Subject: Simplify .img-retina mixin and add explanatory comments
X-Git-Tag: v4.0.0-alpha.2~190^2
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=refs%2Fpull%2F18105%2Fhead;p=thirdparty%2Fbootstrap.git

Simplify .img-retina mixin and add explanatory comments

[skip sauce]
[skip validator]
---

diff --git a/scss/mixins/_image.scss b/scss/mixins/_image.scss
index db590e3c53..91d2f59eea 100644
--- a/scss/mixins/_image.scss
+++ b/scss/mixins/_image.scss
@@ -21,12 +21,13 @@
 @mixin img-retina($file-1x, $file-2x, $width-1x, $height-1x) {
   background-image: url($file-1x);
 
+  // Autoprefixer takes care of adding -webkit-min-device-pixel-ratio and -o-min-device-pixel-ratio,
+  // but doesn't convert dppx=>dpi.
+  // There's no such thing as unprefixed min-device-pixel-ratio since it's nonstandard.
+  // Compatibility info: http://caniuse.com/#feat=css-media-resolution
   @media
-  only screen and (-webkit-min-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) {
+  only screen and (min-resolution: 192dpi), // IE9-11 don't support dppx
+  only screen and (min-resolution: 2dppx) { // Standardized
     background-image: url($file-2x);
     background-size: $width-1x $height-1x;
   }