1 files changed, 42 insertions, 14 deletions

diff --git a/docs-assets/css/docs.css b/docs-assets/css/docs.css
index b0973ae96..79db6f295 100644
--- a/docs-assets/css/docs.css
+++ b/docs-assets/css/docs.css
@@ -586,18 +586,47 @@ h1[id] {
   border-color: #faebcc;
 }
 .bs-callout-warning h4 {
-  color: #c09853;
+  color: #8a6d3b;
 }
 .bs-callout-info {
   background-color: #f4f8fa;
   border-color: #bce8f1;
 }
 .bs-callout-info h4 {
-  color: #3a87ad;
+  color: #34789a;
 }
 
 
 /*
+ * 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.
@@ -921,7 +950,6 @@ h1[id] {
  */
 
 .highlight {
-  display: none; /* hidden by default, until >480px */
   padding: 9px 14px;
   margin-bottom: 14px;
   background-color: #f7f7f9;
@@ -949,13 +977,6 @@ h1[id] {
   color: #bebec5;
 }
 
-/* Show code snippets when we have the space */
-@media (min-width: 481px) {
-  .highlight {
-    display: block;
-  }
-}
-
 
 /*
  * Responsive tests
@@ -1038,11 +1059,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;
@@ -1050,7 +1072,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;
@@ -1063,14 +1085,20 @@ h1[id] {
 .bs-glyphicons .glyphicon-class {
   display: block;
   text-align: center;
+  word-wrap: break-word; /* Help out IE10+ with class names */
 }
 .bs-glyphicons li:hover {
   background-color: rgba(86,61,124,.1);
 }
 
 @media (min-width: 768px) {
+  .bs-glyphicons {
+    margin-left: 0;
+    margin-right: 0;
+  }
   .bs-glyphicons li {
     width: 12.5%;
+    font-size: 12px;
   }
 }