1 files changed, 46 insertions, 13 deletions

diff --git a/docs-assets/css/docs.css b/docs-assets/css/docs.css
index ecf740818..8a9f562e5 100644
--- a/docs-assets/css/docs.css
+++ b/docs-assets/css/docs.css
@@ -598,6 +598,35 @@ h1[id] {
 
 
 /*
+ * Color swatches
+ *
+ * Color swatches and associated values for our grayscale and brand colors.
+ */
+
+.color-swatches {
+  margin: 0 -5px;
+  overflow: hidden; /* clearfix */
+}
+.color-swatch {
+  float: left;
+  width:  100px;
+  height: 100px;
+  margin: 0 5px;
+  border-radius: 3px;
+}
+.color-swatches .gray-darker   { background-color: #222; }
+.color-swatches .gray-dark     { background-color: #333; }
+.color-swatches .gray          { background-color: #555; }
+.color-swatches .gray-light    { background-color: #999; }
+.color-swatches .gray-lighter  { background-color: #eee; }
+.color-swatches .brand-primary { background-color: #428bca; }
+.color-swatches .brand-success { background-color: #5cb85c; }
+.color-swatches .brand-warning { background-color: #f0ad4e; }
+.color-swatches .brand-danger  { background-color: #d9534f; }
+.color-swatches .brand-info    { background-color: #5bc0de; }
+
+
+/*
  * Team members
  *
  * Avatars, names, and usernames for core team.
@@ -730,7 +759,7 @@ h1[id] {
 }
 
 /* Typography */
-.bs-example-type .table .info {
+.bs-example-type .table .type-info {
   color: #999;
   vertical-align: middle;
 }
@@ -750,6 +779,11 @@ h1[id] {
   margin: 0;
 }
 
+/* Contextual background colors */
+.bs-example-bg-classes p {
+  padding: 15px;
+}
+
 /* Images */
 .bs-example > .img-circle,
 .bs-example > .img-rounded,
@@ -921,7 +955,6 @@ h1[id] {
  */
 
 .highlight {
-  display: none; /* hidden by default, until >480px */
   padding: 9px 14px;
   margin-bottom: 14px;
   background-color: #f7f7f9;
@@ -949,13 +982,6 @@ h1[id] {
   color: #bebec5;
 }
 
-/* Show code snippets when we have the space */
-@media (min-width: 481px) {
-  .highlight {
-    display: block;
-  }
-}
-
 
 /*
  * Responsive tests
@@ -998,6 +1024,7 @@ h1[id] {
   margin-bottom: 10px;
 }
 .responsive-utilities-test span {
+  display: block;
   padding: 15px 10px;
   font-size: 14px;
   font-weight: bold;
@@ -1037,11 +1064,12 @@ h1[id] {
  */
 
 .bs-glyphicons {
+  margin: 0 -19px 20px -16px;
+  overflow: hidden;
+}
+.bs-glyphicons-list {
   padding-left: 0;
-  padding-bottom: 1px;
-  margin-bottom: 20px;
   list-style: none;
-  overflow: hidden;
 }
 .bs-glyphicons li {
   float: left;
@@ -1049,7 +1077,7 @@ h1[id] {
   height: 115px;
   padding: 10px;
   margin: 0 -1px -1px 0;
-  font-size: 12px;
+  font-size: 10px;
   line-height: 1.4;
   text-align: center;
   border: 1px solid #ddd;
@@ -1069,8 +1097,13 @@ h1[id] {
 }
 
 @media (min-width: 768px) {
+  .bs-glyphicons {
+    margin-left: 0;
+    margin-right: 0;
+  }
   .bs-glyphicons li {
     width: 12.5%;
+    font-size: 12px;
   }
 }