navbar

docs/build/index.js

@@ -2,7 +2,7 @@
 var hogan = require('hogan.js')
   , fs    = require('fs')
   , prod  = process.argv[2] == 'production'
-  , title = 'Bootstrap'
+  , title = 'Bootplus'
 
 var layout, pages
 

less/bootplus/bootplus.less

@@ -66,3 +66,6 @@
 
 // BootPlus specs
 @import "wells.less";
+@import "dropdowns.less";
+
+@import "navbar.less";

less/bootplus/buttons.less

@@ -19,7 +19,7 @@
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
-   .buttonBackground(@btnBackground, @btnBackgroundHighlight, @grayDark, 0 1px 1px rgba(255,255,255,.75));
+   .buttonBackground(@btnBackground, @btnBackgroundHighlight, @grayDark, none);
    border: 1px solid @btnBorder;
    *border: 0; // Remove the border to prevent IE7's black border on input:focus
 //   border-bottom-color: darken(@btnBorder, 10%);
@@ -34,7 +34,7 @@
 //      background-position: 0 -15px;
       .box-shadow(0 1px 1px rgba(0,0,0,.1));
       color: @grayDarker;
-      border-color: darken(@color, 0.6%);
+      border-color: darken(@btnBorder, 0.6%);
 
       // transition is only when going to hover/focus, otherwise the background
       // behind the gradient (there for IE<=9 fallback) gets mismatched
@@ -50,7 +50,7 @@
    &.active,
    &:active {
 //      background-image: none;
-      border-color: darken(@color, 0.6%);
+      border-color: darken(@btnBorder, 0.6%);
       #gradient > .vertical(#fff,#f8f8f8);
       outline: 0;
       .box-shadow(0 1px 2px rgba(0, 0, 0, 0.1) inset);

less/bootplus/dropdowns.less

@@ -0,0 +1,11 @@
+//
+// Dropdown menus
+// --------------------------------------------------
+.dropdown-menu {
+   .border-radius(@borderRadiusSmall);
+   .box-shadow(0 2px 40px rgba(0,0,0,.4));
+
+
+
+
+}

less/bootplus/navbar.less

@@ -0,0 +1,42 @@
+//
+// Navbars (Redux)
+// --------------------------------------------------
+
+
+// COMMON STYLES
+// -------------
+
+
+// Inner for background effects
+// Gradient is applied to its own element because overflow visible is not honored by IE when filter is present
+.navbar-inner {
+  border: 0;
+  .border-radius(0);
+  .box-shadow(none);
+}
+
+
+
+// NAVIGATION
+// ----------
+
+// Links
+.navbar .nav > li > a {
+   border-bottom: 2px solid transparent;
+   color: #737373;
+   font-size: 14px;
+   line-height: 1.4;
+   margin: 0 18px;
+   max-width: 180px;
+   min-width: 20px;
+   overflow: hidden;
+   padding: 13px 0 10px 0;
+   text-overflow: ellipsis;
+   vertical-align: top;
+   white-space: nowrap;
+   text-shadow: none;
+}
+
+//// hover
+//border-color: #427fed;
+//color: #262626;

less/bootplus/variables.less

@@ -14,7 +14,7 @@
 @grayDark:              #444;
 @gray:                  #555;
 @grayLight:             #999;
-@grayLighter:           #eee;
+@grayLighter:           #f5f5f5;
 @white:                 #fff;
 @whiteSmoke:            #E5E5E5;
 
@@ -181,17 +181,17 @@
 @navbarCollapseWidth:             979px;
 @navbarCollapseDesktopWidth:      @navbarCollapseWidth + 1;
 
-@navbarHeight:                    40px;
+@navbarHeight:                    44px;
 @navbarBackgroundHighlight:       #ffffff;
-@navbarBackground:                darken(@navbarBackgroundHighlight, 5%);
+@navbarBackground:                @grayLighter; //darken(@navbarBackgroundHighlight, 5%);
 @navbarBorder:                    darken(@navbarBackground, 12%);
 
-@navbarText:                      @grayLight;
-@navbarLinkColor:                 @grayLight;
-@navbarLinkColorHover:            @white;
+@navbarText:                      #737373;
+@navbarLinkColor:                 #737373;
+@navbarLinkColorHover:            #262626;
 @navbarLinkColorActive:           @white;
 @navbarLinkBackgroundHover:       transparent;
-@navbarLinkBackgroundActive:      darken(@navbarBackground, 5%);
+@navbarLinkBackgroundActive:      transparent;
 
 @navbarBrandColor:                @navbarLinkColor;