Finish migrating to Normalize 2:

* Port print styles from reset.less to scaffolding.less
* Port responsive image styles from reset.less to scaffolding.less

diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index 873673227dae5347d375d58e499a538895614c2d..44581d473cc13078eef132723552853d4c41a758 100644 (file)
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -228,6 +228,19 @@ a:hover {
   text-decoration: underline;
 }
 
+a:focus {
+  outline: thin dotted #333;
+  outline: 5px auto -webkit-focus-ring-color;
+  outline-offset: -2px;
+}
+
+img {
+  width: auto\9;
+  height: auto;
+  max-width: 100%;
+  vertical-align: middle;
+}
+
 .img-rounded {
   border-radius: 6px;
 }
@@ -245,6 +258,58 @@ a:hover {
   border-radius: 500px;
 }
 
+@media print {
+  * {
+    color: #000 !important;
+    text-shadow: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+  }
+  a,
+  a:visited {
+    text-decoration: underline;
+  }
+  a[href]:after {
+    content: " (" attr(href) ")";
+  }
+  abbr[title]:after {
+    content: " (" attr(title) ")";
+  }
+  .ir a:after,
+  a[href^="javascript:"]:after,
+  a[href^="#"]:after {
+    content: "";
+  }
+  pre,
+  blockquote {
+    border: 1px solid #999;
+    page-break-inside: avoid;
+  }
+  thead {
+    display: table-header-group;
+  }
+  tr,
+  img {
+    page-break-inside: avoid;
+  }
+  img {
+    max-width: 100% !important;
+  }
+  @page  {
+    margin: 0.5cm;
+  }
+  p,
+  h2,
+  h3 {
+    orphans: 3;
+    widows: 3;
+  }
+  h2,
+  h3 {
+    page-break-after: avoid;
+  }
+}
+
 .container {
   max-width: 940px;
   margin-right: auto;

diff --git a/less/scaffolding.less b/less/scaffolding.less
index 649b5f94c8cb827b773108c800a08eea9332de81..e596f26d0e57799a2a66b0345b9b953692e84bb1 100644 (file)
--- a/less/scaffolding.less
+++ b/less/scaffolding.less
@@ -35,11 +35,24 @@ a:hover {
   color: @link-color-hover;
   text-decoration: underline;
 }
+a:focus {
+  .tab-focus();
+}
 
 
 // Images
 // -------------------------
 
+img {
+  // Responsive images (ensure images don't scale beyond their parents)
+  max-width: 100%; // Part 1: Set a maxium relative to the parent
+  width: auto\9; // IE8 need help adjusting responsive images
+  height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
+
+  // Match vertical alignment with other comment elements
+  vertical-align: middle;
+}
+
 // Rounded corners
 .img-rounded {
   border-radius: 6px;
@@ -58,3 +71,73 @@ a:hover {
 .img-circle {
   border-radius: 500px; // crank the border-radius so it works with most reasonably sized images
 }
+
+
+// Printing
+// -------------------------
+// Source: https://github.com/h5bp/html5-boilerplate/blob/master/css/main.css
+
+@media print {
+
+  * {
+    text-shadow: none !important;
+    color: #000 !important; // Black prints faster: h5bp.com/s
+    background: transparent !important;
+    box-shadow: none !important;
+  }
+
+  a,
+  a:visited {
+    text-decoration: underline;
+  }
+
+  a[href]:after {
+    content: " (" attr(href) ")";
+  }
+
+  abbr[title]:after {
+    content: " (" attr(title) ")";
+  }
+
+  // Don't show links for images, or javascript/internal links
+  .ir a:after,
+  a[href^="javascript:"]:after,
+  a[href^="#"]:after {
+    content: "";
+  }
+
+  pre,
+  blockquote {
+    border: 1px solid #999;
+    page-break-inside: avoid;
+  }
+
+  thead {
+    display: table-header-group; // h5bp.com/t
+  }
+
+  tr,
+  img {
+    page-break-inside: avoid;
+  }
+
+  img {
+    max-width: 100% !important;
+  }
+
+  @page {
+    margin: 0.5cm;
+  }
+
+  p,
+  h2,
+  h3 {
+    orphans: 3;
+    widows: 3;
+  }
+
+  h2,
+  h3 {
+    page-break-after: avoid;
+  }
+}
\ No newline at end of file