1 files changed, 227 insertions, 134 deletions

diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css
index f3d7c156e..aca8df213 100644
--- a/docs/assets/css/docs.css
+++ b/docs/assets/css/docs.css
@@ -9,24 +9,58 @@
 -------------------------------------------------- */
 
 body {
-  padding-top: 54px;
   position: relative; /* For scrollyspy */
   /* We add the padding to the body for >768px only */
 }
 
-/*  */
-.bs-docs-footer {
-  padding-left:  15px;
+hr {
+  margin-top: 30px;
+  margin-bottom: 30px;
+}
+
+.bs-docs-dl-options h4 {
+  margin-top: 15px;
+  margin-bottom: 5px;
+}
+
+.bs-docs-container,
+.bs-home-container {
+  padding-left: 15px;
   padding-right: 15px;
 }
+.bs-docs-container {
+  max-width: 860px;
+}
+.bs-docs-container .row {
+  margin-left: -15px;
+  margin-right: -15px;
+}
 
+/* Side notes for calling out things */
+.bs-docs-sidenote {
+  margin: 20px 0;
+  padding: 15px 30px 15px 15px;
+  background-color: #fcf2f2;
+  border-left: 5px solid #df7c7b;
+}
+.bs-docs-sidenote h4 {
+  margin-top: 0;
+}
+.bs-docs-sidenote p:last-child {
+  margin-bottom: 0;
+}
+.bs-docs-sidenote code,
+.bs-docs-sidenote .highlight {
+  background-color: #fff;
+}
 
 
 /* Sections
 -------------------------------------------------- */
 
 /* Padding for in-page bookmarks */
-section {
+section,
+.bs-docs-section {
   padding-top: 30px;
 }
 
@@ -41,69 +75,42 @@ section > ul li {
 
 
 
-/* Navbar
+/* Jumbotrons
 -------------------------------------------------- */
 
-.bs-docs-navbar {
-  background-color: #fff;
-  border-bottom: 1px solid #ccc; /* IE8 */
-  border-bottom: 1px solid rgba(0,0,0,.1);
+.bs-docs-section-header {
+  padding-top: 60px;
+  color: #b94a48;
+  border-bottom: 5px solid #b94a48;
 }
-.bs-docs-navbar .nav > .active > a,
-.bs-docs-navbar .nav > .active > a:hover {
-  font-weight: 500;
-  background-color: transparent;
-}
-
-
-
-/* Jumbotrons
--------------------------------------------------- */
 
 /* Base class */
 .bs-docs-jumbotron {
   position: relative;
   margin-bottom: 20px;
   padding: 30px 15px;
-  color: #fff;
   text-align: center;
-  background-color: #b94a48;
 }
 .bs-docs-jumbotron h1 {
   font-size: 50px;
-}
-
-/* Link styles (used on .masthead-links as well) */
-.bs-docs-jumbotron a {
-  color: #fff;
-  color: rgba(255,255,255,.5);
-  -webkit-transition: all .2s ease-in-out;
-     -moz-transition: all .2s ease-in-out;
-          transition: all .2s ease-in-out;
-}
-.bs-docs-jumbotron a:hover {
-  color: #fff;
+  line-height: 1;
 }
 
 /* Download button */
 .bs-docs-jumbotron .btn {
+  margin-top: 5px;
+  margin-bottom: 5px;
   padding: 18px 24px;
   font-size: 21px;
   color: #b94a48; /* redeclare to override the `.jumbotron a` */
   background-color: #fff;
+  border-color: #e5e5e5;
 }
-.bs-docs-jumbotron .btn,
 .bs-docs-jumbotron .btn:hover,
 .bs-docs-jumbotron .btn:active {
-  color: #b94a48; /* redeclare to override the `.jumbotron a` */
-  background-color: #fff;
-  border-color: #fff;
-}
-
-/* Masthead (docs home)
-------------------------- */
-.masthead h1 {
-  line-height: 1;
+  color: #fff; /* redeclare to override the `.jumbotron a` */
+  background-color: #b94a48;
+  border-color: #b94a48;
 }
 
 /* Textual links in masthead */
@@ -113,42 +120,10 @@ section > ul li {
 }
 .masthead-links li {
   display: inline;
-  padding: 0 10px;
-  color: rgba(255,255,255,.25);
-}
-
-
-
-/* Marketing section of Overview
--------------------------------------------------- */
-
-.bs-docs-marketing {
-  text-align: center;
-  color: #5a5a5a;
-}
-.bs-docs-marketing h1 {
-  margin: 60px 0 10px;
-  font-size: 50px;
-  line-height: 1;
-}
-.bs-docs-marketing h2 {
-  margin-bottom: 5px;
-}
-.bs-docs-marketing p {
-  font-size: 16px;
-  line-height: 1.4;
-}
-.bs-docs-marketing .marketing-byline {
-  margin-bottom: 40px;
-  font-size: 21px;
-  font-weight: 300;
-  line-height: 1.25;
   color: #999;
 }
-.marketing-img {
-  display: block;
-  margin: 30px auto 10px;
-  max-height: 145px;
+.masthead-links li + li {
+  margin-left: 20px;
 }
 
 
@@ -159,13 +134,13 @@ section > ul li {
 .show-grid {
   margin-bottom: 15px;
 }
-.show-grid [class*="col-span-"] {
+.show-grid .col {
   padding-top: 10px;
   padding-bottom: 10px;
   background-color: #eee;
   border: 1px solid #ddd;
 }
-.show-grid [class*="col-span-"]:hover {
+.show-grid .col:hover {
   background-color: #ddd;
 }
 
@@ -174,33 +149,84 @@ section > ul li {
 /* Sidenav
 -------------------------------------------------- */
 
-/* Base styles are not affixable given mobile-first */
-.bs-docs-sidenav {
-  margin: 20px 0 0;
-  -webkit-box-sizing: border-box;
-     -moz-box-sizing: border-box;
-          box-sizing: border-box;
-}
-.bs-docs-sidenav.affix {
-  position: static;
+.bs-docs-sidebar {
+  display: none;
+  position: fixed;
   top: 0;
+  left: 0;
+  bottom: 0;
+  width: 240px;
+  overflow-y: scroll;
+  text-shadow: 0 1px 0 #fff;
+  background-color: #f5f5f5;
+  box-shadow: inset -1px 0 0 #e5e5e5;
 }
 
-/* Chevrons within each link */
-.bs-docs-sidenav .glyphicon-chevron-right {
-  float: right;
-  margin-top: 1px;
-  margin-right: -6px;
-  opacity: .25;
-  color: #000;
+/* Nav: first level */
+.bs-docs-sidebar > .nav {
+  margin: 0 0 25px 0;
 }
-.bs-docs-sidenav a:hover .glyphicon-chevron-right {
-  opacity: .5;
+.bs-docs-sidebar .nav > li > a {
+  display: block;
+  color: #666;
+  padding: 4px 25px;
 }
-.bs-docs-sidenav .active .glyphicon-chevron-right,
-.bs-docs-sidenav .active a:hover .glyphicon-chevron-right {
-  color: #fff;
-  opacity: 1;
+.bs-docs-sidebar .nav > li > a:hover,
+.bs-docs-sidebar .nav > li > a:focus {
+  text-decoration: none;
+  border-right: 1px solid #d5d5d5;
+}
+.bs-docs-sidebar .nav > .active > a,
+.bs-docs-sidebar .nav > .active:hover > a,
+.bs-docs-sidebar .nav > .active:focus > a {
+  font-weight: 500;
+  color: #b94a48;
+  background-color: transparent;
+  border-right: 1px solid #b94a48;
+}
+
+/* Nav: second level (shown on .active) */
+.bs-docs-sidebar .nav .nav {
+  display: none;
+  margin-bottom: 5px;
+}
+.bs-docs-sidebar .nav > .active > ul {
+  display: block;
+}
+.bs-docs-sidebar .nav .nav > li > a {
+  padding-top: 2px;
+  padding-bottom: 2px;
+  padding-left: 40px;
+  font-size: 90%;
+}
+
+.bs-docs-sidenav-heading {
+  margin: 0 0 25px;
+}
+.bs-docs-sidenav-heading a {
+  display: block;
+  padding: 15px 25px;
+  color: #b94a48;
+  border-bottom: 1px solid #e5e5e5;
+  box-shadow: 0 1px 0 #fff;
+}
+.bs-docs-sidenav-heading a:hover {
+  color: #a3403e;
+  text-decoration: none;
+}
+
+/* Section headings for groups of links */
+.bs-docs-sidenav > li > .nav-header {
+  margin-top: 20px;
+  margin-bottom: 5px;
+  font-size: 14px;
+  font-weight: 500;
+  color: #333;
+}
+.bs-docs-sidenav > .active > .nav-header,
+.bs-docs-sidenav > .active > .nav-header:hover {
+  color: #333;
+  border-color: #333;
 }
 
 
@@ -240,9 +266,6 @@ section > ul li {
   border-top-left-radius: 0;
   border-top-right-radius: 0;
 }
-.prettyprint .linenums {
-  /*margin-left: 0;*/
-}
 
 /* Tweak content of examples for optimum awesome */
 .bs-docs-example > p:last-child,
@@ -254,7 +277,10 @@ section > ul li {
 .bs-docs-example > textarea:last-child,
 .bs-docs-example > .table:last-child,
 .bs-docs-example > .jumbotron:last-child,
-.bs-docs-example > .alert:last-child {
+.bs-docs-example > .alert:last-child,
+.bs-docs-example > .panel:last-child,
+.bs-docs-example > .list-group:last-child,
+.bs-docs-example > .well:last-child {
   margin-bottom: 0;
 }
 
@@ -282,20 +308,31 @@ section > ul li {
   margin: 0;
 }
 
+/* List groups */
+.bs-docs-example > .list-group {
+  max-width: 400px;
+}
 
 /* Navbar examples */
 .bs-navbar-top-example,
 .bs-navbar-bottom-example {
   z-index: 1;
   padding: 0;
-  height: 90px;
+  min-height: 110px;
   overflow: hidden; /* cut the drop shadows off */
 }
 .bs-navbar-top-example .navbar-fixed-top,
 .bs-navbar-bottom-example .navbar-fixed-bottom {
+  position: relative;
   margin-left: 0;
   margin-right: 0;
 }
+.bs-navbar-top-example .navbar-fixed-top {
+  top: -1px;
+}
+.bs-navbar-bottom-example .navbar-fixed-bottom {
+  bottom: -1px;
+}
 .bs-navbar-top-example {
   -webkit-border-radius: 0 0 4px 4px;
      -moz-border-radius: 0 0 4px 4px;
@@ -345,7 +382,7 @@ section > ul li {
   margin-bottom: 5px;
 }
 .bs-docs-example-submenu {
-  min-height: 180px;
+  min-height: 230px;
 }
 .bs-docs-example-submenu > .pull-left + .pull-left {
   margin-left: 20px;
@@ -356,6 +393,30 @@ section > ul li {
   margin-bottom: 15px;
 }
 
+/* Tooltips */
+.bs-docs-tooltip-examples {
+  text-align: center;
+  margin: 0 0 10px;
+  list-style: none;
+}
+.bs-docs-tooltip-examples li {
+  display: inline;
+  padding: 0 10px;
+}
+
+/* Popovers */
+.bs-docs-example-popover {
+  padding-bottom: 24px;
+  background-color: #f9f9f9;
+}
+.bs-docs-example-popover .popover {
+  position: relative;
+  display: block;
+  float: left;
+  width: 260px;
+  margin: 20px;
+}
+
 
 /* Example templates
 -------------------------------------------------- */
@@ -485,8 +546,8 @@ section > ul li {
 -------------------------------------------------- */
 
 .bs-docs-footer {
-  text-align: center;
-  padding: 30px 0;
+  padding-top: 30px;
+  padding-bottom: 30px;
   margin-top: 100px;
   border-top: 1px solid #e5e5e5;
 }
@@ -507,22 +568,22 @@ section > ul li {
 
 /* Social proof buttons from GitHub & Twitter */
 .bs-docs-social {
-  margin-top: 10px;
+  margin-top: 80px;
   margin-bottom: 20px;
-  text-align: center;
 }
 /* Quick links on Home */
 .bs-docs-social-buttons {
   display: inline-block;
   margin: 0;
-  padding: 0 10px;
   list-style: none;
 }
 .bs-docs-social-buttons li {
   display: inline-block;
-  padding: 5px 8px;
   line-height: 1;
 }
+.bs-docs-social-buttons li + li {
+  margin-left: 15px;
+}
 .bs-docs-social-buttons .twitter-follow-button {
   width: 225px !important;
 }
@@ -564,6 +625,7 @@ input.focused {
   margin-bottom: 0;
   background-color: transparent;
   border: 0;
+  white-space: nowrap;
 }
 .highlight pre code {
   font-size: inherit;
@@ -605,9 +667,46 @@ input.focused {
 /* Tablets and up */
 @media screen and (min-width: 768px) {
 
+  /* Back to top link */
+  .bs-docs-top {
+    float: left;
+    padding: 7px 15px;
+    font-weight: 500;
+    color: #999;
+    background-color: #eee;
+    border-radius: 4px;
+  }
+  .bs-docs-top:hover {
+    color: #fff;
+    text-decoration: none;
+    background-color: #999;
+  }
+  .bs-docs-top.affix {
+    position: fixed;
+    right:  15px;
+    bottom: 15px;
+  }
+
+  .bs-docs-section-header h1 {
+    font-size: 80px;
+    font-size: 8rem;
+    line-height: 1;
+  }
+
   /* Account for fixed navbar (which is static to start) */
-  body {
-    padding-top: 50px; /* Default height of navbar */
+  .bs-docs-docs {
+    padding-left: 260px;
+  }
+
+  /* Undo custom padding */
+  .bs-docs-container {
+    padding-left: 0;
+    padding-right: 0;
+  }
+
+  /* Show the docs nav */
+  .bs-docs-sidebar {
+    display: block;
   }
 
   /* Tweak display of docs jumbotrons */
@@ -619,9 +718,9 @@ input.focused {
     font-size: 100px;
   }
   .masthead p {
+    margin-left: 15%;
+    margin-right: 15%;
     font-size: 30px;
-    margin-left: 10%;
-    margin-right: 10%;
   }
   .subhead {
     padding-top:    60px;
@@ -629,37 +728,31 @@ input.focused {
     text-align: left;
   }
 
-  /* From here, start to affix the nav because we keep columns here */
-  .bs-docs-sidenav.affix {
-    position: fixed;
-    top: 54px;
-  }
-  .bs-docs-sidenav {
-    width: 170px;
-  }
-  .bs-docs-sidenav.affix-bottom {
+  .bs-navbar-top-example .navbar-fixed-top,
+  .bs-navbar-bottom-example .navbar-fixed-bottom {
     position: absolute;
-    top: auto;
-    bottom: 270px;
   }
+
 }
 
 /* Tablets/desktops and up */
 @media screen and (min-width: 992px) {
 
+  .bs-docs-docs {
+    padding-left: 280px;
+  }
+
   /* Icons */
   .the-icons li {
     width: 12.5%;
   }
 
-  .bs-docs-sidenav {
-    width: 220px;
-  }
 }
 
 /* Large desktops and up */
 @media screen and (min-width: 1200px) {
-  .bs-docs-sidenav {
-    width: 260px;
+  .bs-docs-docs {
+    padding-left: 300px;
   }
+
 }