Merge branch '2.1.0-wip-navbar' into 2.1.0-wip

docs/assets/css/bootstrap-responsive.css

@@ -935,14 +935,14 @@
     display: none;
   }
   .nav-collapse .nav .nav-header {
-    color: #999999;
+    color: #555555;
     text-shadow: none;
   }
   .nav-collapse .nav > li > a,
   .nav-collapse .dropdown-menu a {
     padding: 6px 15px;
     font-weight: bold;
-    color: #999999;
+    color: #555555;
     -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
             border-radius: 3px;
@@ -959,7 +959,7 @@
   }
   .nav-collapse .nav > li > a:hover,
   .nav-collapse .dropdown-menu a:hover {
-    background-color: #111111;
+    background-color: #f2f2f2;
   }
   .nav-collapse.in .btn-group {
     padding: 0;
@@ -995,8 +995,8 @@
     float: none;
     padding: 10px 15px;
     margin: 10px 0;
-    border-top: 1px solid #111111;
-    border-bottom: 1px solid #111111;
+    border-top: 1px solid #f2f2f2;
+    border-bottom: 1px solid #f2f2f2;
     -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
        -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
             box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);

docs/assets/css/docs.css

@@ -28,10 +28,10 @@ h3 code {
 
 body > .navbar-fixed-top {
   font-size: 13px;
-  -webkit-box-shadow: 0 5px 15px rgba(0,0,0,.15);
+/*  -webkit-box-shadow: 0 5px 15px rgba(0,0,0,.15);
      -moz-box-shadow: 0 5px 15px rgba(0,0,0,.15);
           box-shadow: 0 5px 15px rgba(0,0,0,.15);
-}
+*/}
 
 /* Change the docs' brand */
 body > .navbar-fixed-top .brand {
@@ -597,6 +597,7 @@ h2 + .row {
   z-index: 1;
   padding: 0;
   height: 90px;
+  overflow: hidden; /* cut the drop shadows off */
 }
 .bs-navbar-top-example .navbar-fixed-top,
 .bs-navbar-bottom-example .navbar-fixed-bottom {

docs/base-css.html

@@ -31,7 +31,7 @@
 
     <!-- Navbar
     ================================================== -->
-    <div class="navbar navbar-fixed-top">
+    <div class="navbar navbar-inverse navbar-fixed-top">
       <div class="navbar-inner">
         <div class="container">
           <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
@@ -1462,7 +1462,8 @@ For example, &lt;code&gt;section&lt;/code&gt; should be wrapped as inline.
 </pre>
           <p>Create block level buttons&mdash;those that span the full width of a parent&mdash; by adding <code>.btn-block</code>.</p>
           <div class="bs-docs-example">
-            <div class="well" style="max-width: 400px; margin: 0 auto;">
+            <div class="well" style="max-width: 400px; margin: 0 auto 10px;">
+              <button type="button" class="btn btn-large btn-primary btn-block">Block level button</button>
               <button type="button" class="btn btn-large btn-block">Block level button</button>
             </div>
           </div>

docs/components.html

@@ -31,7 +31,7 @@
 
     <!-- Navbar
     ================================================== -->
-    <div class="navbar navbar-fixed-top">
+    <div class="navbar navbar-inverse navbar-fixed-top">
       <div class="navbar-inner">
         <div class="container">
           <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
@@ -1246,10 +1246,10 @@
           <hr class="bs-docs-separator">
 
 
-          <h2>Subnav variation</h2>
-          <p>Modify the look of the navbar by adding <code>.navbar-subnav</code>. Perfect for a secondary nav, or just a replacement to the default dark navbar.</p>
+          <h2>Inverted variation</h2>
+          <p>Modify the look of the navbar by adding <code>.navbar-inverse</code>.</p>
           <div class="bs-docs-example">
-            <div class="navbar navbar-subnav" style="position: static;">
+            <div class="navbar navbar-inverse" style="position: static;">
               <div class="navbar-inner">
                 <div class="container">
                   <a class="btn btn-navbar" data-toggle="collapse" data-target=".subnav-collapse">
@@ -1257,6 +1257,7 @@
                     <span class="icon-bar"></span>
                     <span class="icon-bar"></span>
                   </a>
+                  <a class="brand" href="#">Title</a>
                   <div class="nav-collapse subnav-collapse">
                     <ul class="nav">
                       <li class="active"><a href="#">Home</a></li>

docs/customize.html

@@ -31,7 +31,7 @@
 
     <!-- Navbar
     ================================================== -->
-    <div class="navbar navbar-fixed-top">
+    <div class="navbar navbar-inverse navbar-fixed-top">
       <div class="navbar-inner">
         <div class="container">
           <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">

docs/extend.html

@@ -31,7 +31,7 @@
 
     <!-- Navbar
     ================================================== -->
-    <div class="navbar navbar-fixed-top">
+    <div class="navbar navbar-inverse navbar-fixed-top">
       <div class="navbar-inner">
         <div class="container">
           <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">

docs/getting-started.html

@@ -31,7 +31,7 @@
 
     <!-- Navbar
     ================================================== -->
-    <div class="navbar navbar-fixed-top">
+    <div class="navbar navbar-inverse navbar-fixed-top">
       <div class="navbar-inner">
         <div class="container">
           <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">

docs/index.html

@@ -31,7 +31,7 @@
 
     <!-- Navbar
     ================================================== -->
-    <div class="navbar navbar-fixed-top">
+    <div class="navbar navbar-inverse navbar-fixed-top">
       <div class="navbar-inner">
         <div class="container">
           <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">

docs/javascript.html

@@ -31,7 +31,7 @@
 
     <!-- Navbar
     ================================================== -->
-    <div class="navbar navbar-fixed-top">
+    <div class="navbar navbar-inverse navbar-fixed-top">
       <div class="navbar-inner">
         <div class="container">
           <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">

docs/scaffolding.html

@@ -31,7 +31,7 @@
 
     <!-- Navbar
     ================================================== -->
-    <div class="navbar navbar-fixed-top">
+    <div class="navbar navbar-inverse navbar-fixed-top">
       <div class="navbar-inner">
         <div class="container">
           <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">

docs/templates/layout.mustache

@@ -43,7 +43,7 @@
 
     <!-- Navbar
     ================================================== -->
-    <div class="navbar navbar-fixed-top">
+    <div class="navbar navbar-inverse navbar-fixed-top">
       <div class="navbar-inner">
         <div class="container">
           <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">

docs/templates/pages/base-css.mustache

@@ -1399,7 +1399,8 @@
 </pre>
           <p>{{_i}}Create block level buttons&mdash;those that span the full width of a parent&mdash; by adding <code>.btn-block</code>.{{/i}}</p>
           <div class="bs-docs-example">
-            <div class="well" style="max-width: 400px; margin: 0 auto;">
+            <div class="well" style="max-width: 400px; margin: 0 auto 10px;">
+              <button type="button" class="btn btn-large btn-primary btn-block">{{_i}}Block level button{{/i}}</button>
               <button type="button" class="btn btn-large btn-block">{{_i}}Block level button{{/i}}</button>
             </div>
           </div>

docs/templates/pages/components.mustache

@@ -1175,10 +1175,10 @@
           <hr class="bs-docs-separator">
 
 
-          <h2>{{_i}}Subnav variation{{/i}}</h2>
-          <p>{{_i}}Modify the look of the navbar by adding <code>.navbar-subnav</code>. Perfect for a secondary nav, or just a replacement to the default dark navbar.{{/i}}</p>
+          <h2>{{_i}}Inverted variation{{/i}}</h2>
+          <p>{{_i}}Modify the look of the navbar by adding <code>.navbar-inverse</code>.{{/i}}</p>
           <div class="bs-docs-example">
-            <div class="navbar navbar-subnav" style="position: static;">
+            <div class="navbar navbar-inverse" style="position: static;">
               <div class="navbar-inner">
                 <div class="container">
                   <a class="btn btn-navbar" data-toggle="collapse" data-target=".subnav-collapse">
@@ -1186,6 +1186,7 @@
                     <span class="icon-bar"></span>
                     <span class="icon-bar"></span>
                   </a>
+                  <a class="brand" href="#">{{_i}}Title{{/i}}</a>
                   <div class="nav-collapse subnav-collapse">
                     <ul class="nav">
                       <li class="active"><a href="#">{{_i}}Home{{/i}}</a></li>

docs/upgrading.html

@@ -31,7 +31,7 @@
 
     <!-- Navbar
     ================================================== -->
-    <div class="navbar navbar-fixed-top">
+    <div class="navbar navbar-inverse navbar-fixed-top">
       <div class="navbar-inner">
         <div class="container">
           <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">

less/bootstrap.less

@@ -40,7 +40,8 @@
 
 // Components: Nav
 @import "navs.less";
-@import "navbar.less";
+//@import "navbar.less";
+@import "navbar-redux.less";
 @import "breadcrumbs.less";
 @import "pagination.less";
 @import "pager.less";

less/buttons.less

@@ -107,6 +107,9 @@
   padding-right: 0;
   .box-sizing(border-box);
 }
+.btn-block + .btn-block {
+  margin-top: 5px;
+}
 
 
 // Alternate buttons

less/dropdowns.less

@@ -28,7 +28,6 @@
   border-right: 4px solid transparent;
   border-left:  4px solid transparent;
   content: "";
-  .opacity(30);
 }
 
 // Place the caret
@@ -36,15 +35,6 @@
   margin-top: 8px;
   margin-left: 2px;
 }
-.dropdown a:focus .caret,
-.dropdown a:hover .caret,
-.open .caret {
-  .opacity(100);
-}
-
-.navbar .nav .open > a {
-  color: @navbarLinkColorActive;
-}
 
 // The dropdown menu (ul)
 // ----------------------
@@ -57,7 +47,7 @@
   float: left;
   min-width: 160px;
   padding: 5px 0;
-  margin: 1px 0 0; // override default ul
+  margin: 2px 0 0; // override default ul
   list-style: none;
   background-color: @dropdownBackground;
   border: 1px solid #ccc; // Fallback for IE7-8

less/navbar.less

@@ -483,5 +483,3 @@
      -moz-border-radius: 0;
           border-radius: 0;
 }
-
-

less/variables.less

@@ -155,15 +155,16 @@
 // Navbar
 // -------------------------
 @navbarHeight:                    40px;
-@navbarBackground:                #111;
-@navbarBackgroundHighlight:       #222;
-
-@navbarText:                      @grayLight;
-@navbarLinkColor:                 @grayLight;
-@navbarLinkColorHover:            @white;
-@navbarLinkColorActive:           @navbarLinkColorHover;
+@navbarBackground:                darken(@navbarBackgroundHighlight, 5%);
+@navbarBackgroundHighlight:       #ffffff;
+@navbarBorder:                    darken(@navbarBackground, 12%);
+
+@navbarText:                      @gray;
+@navbarLinkColor:                 @gray;
+@navbarLinkColorHover:            @grayDark;
+@navbarLinkColorActive:           @gray;
 @navbarLinkBackgroundHover:       transparent;
-@navbarLinkBackgroundActive:      @navbarBackground;
+@navbarLinkBackgroundActive:      darken(@navbarBackground, 5%);
 
 @navbarSearchBackground:          lighten(@navbarBackground, 25%);
 @navbarSearchBackgroundFocus:     @white;
@@ -171,6 +172,26 @@
 @navbarSearchPlaceholderColor:    #ccc;
 @navbarBrandColor:                @navbarLinkColor;
 
+// Inverted navbar
+@navbarInverseBackground:                #111111;
+@navbarInverseBackgroundHighlight:       #222222;
+@navbarInverseBorder:                    #252525;
+
+@navbarInverseText:                      @grayLight;
+@navbarInverseLinkColor:                 @grayLight;
+@navbarInverseLinkColorHover:            @white;
+@navbarInverseLinkColorActive:           @navbarInverseLinkColorHover;
+@navbarInverseLinkBackgroundHover:       transparent;
+@navbarInverseLinkBackgroundActive:      @navbarInverseBackground;
+
+@navbarInverseSearchBackground:          lighten(@navbarInverseBackground, 25%);
+@navbarInverseSearchBackgroundFocus:     @white;
+@navbarInverseSearchBorder:              @navbarInverseBackground;
+@navbarInverseSearchPlaceholderColor:    #ccc;
+
+@navbarInverseBrandColor:                @navbarInverseLinkColor;
+
+
 
 // Hero unit
 // -------------------------