more vars changing

docs/customize.html

@@ -423,15 +423,15 @@
                 <input type="text" class="span3" placeholder="@navbarCollapseWidth + 1">
 
                 <h3>Dropdowns</h3>
-                <label>@dropdownBackground</label>
+                <label>@dropdown-background</label>
                 <input type="text" class="span3" placeholder="#fff">
-                <label>@dropdownBorder</label>
+                <label>@dropdown-border</label>
                 <input type="text" class="span3" placeholder="rgba(0,0,0,.2)">
-                <label>@dropdownLinkColor</label>
+                <label>@dropdown-link-color</label>
                 <input type="text" class="span3" placeholder="@grayDark">
-                <label>@dropdownLinkColorHover</label>
+                <label>@dropdown-link-color-hover</label>
                 <input type="text" class="span3" placeholder="#fff">
-                <label>@dropdownLinkBackgroundHover</label>
+                <label>@dropdown-link-background-hover</label>
                 <input type="text" class="span3" placeholder="@link-color">
               </div><!-- /span -->
             </div><!-- /row -->

docs/templates/pages/customize.mustache

@@ -355,15 +355,15 @@
                 <input type="text" class="span3" placeholder="@navbarCollapseWidth + 1">
 
                 <h3>{{_i}}Dropdowns{{/i}}</h3>
-                <label>@dropdownBackground</label>
+                <label>@dropdown-background</label>
                 <input type="text" class="span3" placeholder="#fff">
-                <label>@dropdownBorder</label>
+                <label>@dropdown-border</label>
                 <input type="text" class="span3" placeholder="rgba(0,0,0,.2)">
-                <label>@dropdownLinkColor</label>
+                <label>@dropdown-link-color</label>
                 <input type="text" class="span3" placeholder="@grayDark">
-                <label>@dropdownLinkColorHover</label>
+                <label>@dropdown-link-color-hover</label>
                 <input type="text" class="span3" placeholder="#fff">
-                <label>@dropdownLinkBackgroundHover</label>
+                <label>@dropdown-link-background-hover</label>
                 <input type="text" class="span3" placeholder="@link-color">
               </div><!-- /span -->
             </div><!-- /row -->

less/dropdowns.less

@@ -45,9 +45,9 @@
   padding: 5px 0;
   margin: 2px 0 0; // override default ul
   list-style: none;
-  background-color: @dropdownBackground;
+  background-color: @dropdown-background;
   border: 1px solid #ccc; // IE8 fallback
-  border: 1px solid @dropdownBorder;
+  border: 1px solid @dropdown-border;
   border-radius: @border-radius-base;
   .box-shadow(0 5px 10px rgba(0,0,0,.2));
   .background-clip(padding-box);
@@ -60,7 +60,7 @@
 
   // Dividers (basically an hr) within the dropdown
   .divider {
-    .nav-divider(@dropdownDividerTop, @dropdownDividerBottom);
+    .nav-divider(@dropdown-divider-top, @dropdown-divider-bottom);
   }
 
   // Links within the dropdown menu
@@ -70,7 +70,7 @@
     clear: both;
     font-weight: normal;
     line-height: @line-height-base;
-    color: @dropdownLinkColor;
+    color: @dropdown-link-color;
     white-space: nowrap;
   }
 }
@@ -81,18 +81,18 @@
 .dropdown-menu li > a:focus,
 .dropdown-submenu:hover > a {
   text-decoration: none;
-  color: @dropdownLinkColorHover;
-  #gradient > .vertical(@dropdownLinkBackgroundHover, darken(@dropdownLinkBackgroundHover, 5%));
+  color: @dropdown-link-color-hover;
+  #gradient > .vertical(@dropdown-link-background-hover, darken(@dropdown-link-background-hover, 5%));
 }
 
 // Active state
 // ------------
 .dropdown-menu .active > a,
 .dropdown-menu .active > a:hover {
-  color: @dropdownLinkColorActive;
+  color: @dropdown-link-color-active;
   text-decoration: none;
   outline: 0;
-  #gradient > .vertical(@dropdownLinkBackgroundActive, darken(@dropdownLinkBackgroundActive, 5%));
+  #gradient > .vertical(@dropdown-link-background-active, darken(@dropdown-link-background-active, 5%));
 }
 
 // Disabled state
@@ -182,12 +182,12 @@
   border-color: transparent;
   border-style: solid;
   border-width: 5px 0 5px 5px;
-  border-left-color: darken(@dropdownBackground, 20%);
+  border-left-color: darken(@dropdown-background, 20%);
   margin-top: 5px;
   margin-right: -10px;
 }
 .dropdown-submenu:hover > a:after {
-  border-left-color: @dropdownLinkColorHover;
+  border-left-color: @dropdown-link-color-hover;
 }
 
 // Left aligned submenus

less/navbar.less

@@ -279,7 +279,7 @@
     border-left:   7px solid transparent;
     border-right:  7px solid transparent;
     border-bottom: 7px solid #ccc;
-    border-bottom-color: @dropdownBorder;
+    border-bottom-color: @dropdown-border;
     position: absolute;
     top: -7px;
     left: 9px;
@@ -289,7 +289,7 @@
     display: inline-block;
     border-left:   6px solid transparent;
     border-right:  6px solid transparent;
-    border-bottom: 6px solid @dropdownBackground;
+    border-bottom: 6px solid @dropdown-background;
     position: absolute;
     top: -6px;
     left: 10px;
@@ -299,13 +299,13 @@
 .navbar-fixed-bottom .nav > li > .dropdown-menu {
   &:before {
     border-top: 7px solid #ccc;
-    border-top-color: @dropdownBorder;
+    border-top-color: @dropdown-border;
     border-bottom: 0;
     bottom: -7px;
     top: auto;
   }
   &:after {
-    border-top: 6px solid @dropdownBackground;
+    border-top: 6px solid @dropdown-background;
     border-bottom: 0;
     bottom: -6px;
     top: auto;

less/variables.less

@@ -30,12 +30,14 @@
 
 // Scaffolding
 // -------------------------
+
 @body-background:         #fff;
 @text-color:              @grayDark;
 
 
 // Links
 // -------------------------
+
 @link-color:              #08c;
 @link-color-hover:        darken(@link-color, 15%);
 
@@ -73,14 +75,17 @@
 
 // Tables
 // -------------------------
+
 @table-background:                   transparent; // overall background-color
 @table-background-accent:            #f9f9f9; // for striping
 @table-background-hover:             #f5f5f5; // for hover
+
 @table-border:                       #ddd; // table and cell border
 
 
 // Buttons
 // -------------------------
+
 @btn-background:                     #fff;
 @btn-background-highlight:           darken(#fff, 10%);
 @btn-border:                         #bbb;
@@ -106,28 +111,33 @@
 
 // Forms
 // -------------------------
+
 @input-background:               #fff;
+@input-background-disabled:      @grayLighter;
+
 @input-border:                   #ccc;
 @input-border-radius:            @border-radius-base;
 @input-border-radius-search:     20px;
-@input-background-disabled:      @grayLighter;
+
 @form-actions-background:        #f5f5f5;
+
 @input-height:                   @line-height-base + 14px; // base line-height + 12px vertical padding + 2px top/bottom border
 
 
 // Dropdowns
 // -------------------------
-@dropdownBackground:            #fff;
-@dropdownBorder:                rgba(0,0,0,.2);
-@dropdownDividerTop:            #e5e5e5;
-@dropdownDividerBottom:         #fff;
 
-@dropdownLinkColor:             @grayDark;
-@dropdownLinkColorHover:        #fff;
-@dropdownLinkColorActive:       #fff;
+@dropdown-background:            #fff;
+@dropdown-border:                rgba(0,0,0,.2);
+@dropdown-divider-top:            #e5e5e5;
+@dropdown-divider-bottom:         #fff;
+
+@dropdown-link-color:             @grayDark;
+@dropdown-link-color-hover:        #fff;
+@dropdown-link-color-active:       #fff;
 
-@dropdownLinkBackgroundActive:  @link-color;
-@dropdownLinkBackgroundHover:   @dropdownLinkBackgroundActive;
+@dropdown-link-background-active:  @link-color;
+@dropdown-link-background-hover:   @dropdown-link-background-active;