Combine .thumbnail and .img-thumbnail into simpler selectors

diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index 0ec2e4ddc4b89cc9a997bfa89d5918bdbdef9703..46cd2bc4bc6909faaf1e66d55188ef0eba19cd5f 100644 (file)
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -262,19 +262,6 @@ img {
   border-radius: 6px;
 }
 
-.img-thumbnail {
-  display: block;
-  display: inline-block;
-  padding: 4px;
-  line-height: 20px;
-  border: 1px solid #ddd;
-  border-radius: 4px;
-  -webkit-transition: all 0.2s ease-in-out;
-     -moz-transition: all 0.2s ease-in-out;
-       -o-transition: all 0.2s ease-in-out;
-          transition: all 0.2s ease-in-out;
-}
-
 .img-circle {
   border-radius: 500px;
 }
@@ -3932,8 +3919,8 @@ button.close {
   margin-top: 5px;
 }
 
-.thumbnail {
-  display: block;
+.thumbnail,
+.img-thumbnail {
   padding: 4px;
   line-height: 20px;
   border: 1px solid #ddd;
@@ -3944,6 +3931,14 @@ button.close {
           transition: all 0.2s ease-in-out;
 }
 
+.thumbnail {
+  display: block;
+}
+
+.img-thumbnail {
+  display: inline-block;
+}
+
 a.thumbnail:hover {
   border-color: #428bca;
 }

diff --git a/less/scaffolding.less b/less/scaffolding.less
index 7cc77b1bd5cfd92c3adeec8d3c93513673156e46..e7b815b8216c1e4795f8c22f586a7162d7d3fd95 100644 (file)
--- a/less/scaffolding.less
+++ b/less/scaffolding.less
@@ -78,10 +78,7 @@ img {
 }
 
 // Image thumbnails
-.img-thumbnail {
-  .thumbnail();
-  display: inline-block;
-}
+// See thumbnails.less for `.img-thumbnail`
 
 // Perfect circle
 .img-circle {

diff --git a/less/thumbnails.less b/less/thumbnails.less
index 69e69a4e167a8f1988ff8913957bda6f130bb953..3c583f8ca1c218049324fe144de4c145455e1e8f 100644 (file)
--- a/less/thumbnails.less
+++ b/less/thumbnails.less
@@ -3,15 +3,26 @@
 // --------------------------------------------------
 
 
-// The actual thumbnail (can be `a` or `div`)
-.thumbnail {
-  display: block;
+// Base classes
+// For thumbnail block-level composite components and simple image styles
+
+// The actual thumbnailed element
+// Can be `a`, `div`, or `img`
+.thumbnail,
+.img-thumbnail {
   padding: 4px;
   line-height: @line-height-base;
   border: 1px solid #ddd;
   border-radius: @border-radius-base;
   .transition(all .2s ease-in-out);
 }
+.thumbnail {
+  display: block;
+}
+.img-thumbnail {
+  display: inline-block;
+}
+
 // Add a hover state for linked versions only
 a.thumbnail:hover {
   border-color: @link-color;