3.0.0 -> 3.0.1
[bootswatch] / bower_components / bootstrap / less / scaffolding.less
old mode 100644 (file)
new mode 100755 (executable)
index b6128dc..976b4e3
@@ -4,15 +4,15 @@
 
 
 // Reset the box-sizing
-// -------------------------
 
-* {
+*,
+*:before,
+*:after {
   .box-sizing(border-box);
 }
 
 
 // Body reset
-// -------------------------
 
 html {
   font-size: 62.5%;
@@ -39,24 +39,24 @@ textarea {
 
 
 // Links
-// -------------------------
 
 a {
   color: @link-color;
   text-decoration: none;
-}
-a:hover,
-a:focus {
-  color: @link-hover-color;
-  text-decoration: underline;
-}
-a:focus {
-  .tab-focus();
+
+  &:hover,
+  &:focus {
+    color: @link-hover-color;
+    text-decoration: underline;
+  }
+
+  &:focus {
+    .tab-focus();
+  }
 }
 
 
 // Images
-// -------------------------
 
 img {
   vertical-align: middle;
@@ -64,9 +64,7 @@ img {
 
 // Responsive images (ensure images don't scale beyond their parents)
 .img-responsive {
-  display: inline-block;
-  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
+  .img-responsive();
 }
 
 // Rounded corners
@@ -75,16 +73,27 @@ img {
 }
 
 // Image thumbnails
-// See thumbnails.less for `.img-thumbnail`
+//
+// Heads up! This is mixin-ed into thumbnails.less for `.thumbnail`.
+.img-thumbnail {
+  padding: @thumbnail-padding;
+  line-height: @line-height-base;
+  background-color: @thumbnail-bg;
+  border: 1px solid @thumbnail-border;
+  border-radius: @thumbnail-border-radius;
+  .transition(all .2s ease-in-out);
+
+  // Keep them at most 100% wide
+  .img-responsive(inline-block);
+}
 
 // Perfect circle
 .img-circle {
-  border-radius: 500px; // crank the border-radius so it works with most reasonably sized images
+  border-radius: 50%; // set radius in percents
 }
 
 
 // Horizontal rules
-// -------------------------
 
 hr {
   margin-top:    @line-height-computed;
@@ -93,3 +102,18 @@ hr {
   border-top: 1px solid @hr-border;
 }
 
+
+// Only display content to screen readers
+//
+// See: http://a11yproject.com/posts/how-to-hide-content/
+
+.sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  margin: -1px;
+  padding: 0;
+  overflow: hidden;
+  clip: rect(0,0,0,0);
+  border: 0;
+}