fixes #9582: restore img-responsive as a class and move it's mixin to mixins.less

dist/css/bootstrap.css

@@ -344,6 +344,12 @@ img {
   vertical-align: middle;
 }
 
+.img-responsive {
+  display: block;
+  height: auto;
+  max-width: 100%;
+}
+
 .img-rounded {
   border-radius: 6px;
 }

less/mixins.less

@@ -294,10 +294,10 @@
 
 
 
-// RETINA IMAGE SUPPORT
+// Retina images
-// --------------------------------------------------
+//
-
 // Short retina mixin for setting background-image and -size
+
 .img-retina(@file-1x; @file-2x; @width-1x; @height-1x) {
   background-image: url("@{file-1x}");
 
@@ -314,6 +314,17 @@
 }
 
 
+// Responsive image
+//
+// Keep images from scaling beyond the width of their parents.
+
+.img-responsive(@display: block;) {
+  display: @display;
+  max-width: 100%; // Part 1: Set a maximum relative to the parent
+  height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
+}
+
+
 // COMPONENT MIXINS
 // --------------------------------------------------
 

less/scaffolding.less

@@ -73,10 +73,8 @@ img {
 }
 
 // Responsive images (ensure images don't scale beyond their parents)
-.img-responsive(@display: block;) {
+.img-responsive {
-  display: @display;
+  .img-responsive();
-  max-width: 100%; // Part 1: Set a maximum relative to the parent
-  height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
 }
 
 // Rounded corners