Update forms vars

* Reorganize layout
* Add input group var
* Add legend border var

customize.html

@@ -780,27 +780,35 @@ lead: Customize Bootstrap's components, LESS variables, and jQuery plugins to ge
       <h2 id="variables-forms">Forms</h2>
       <div class="row">
         <div class="col-lg-6">
-          <h3>Background</h3>
+          <h3>Inputs</h3>
           <label>@input-bg</label>
           <input type="text" placeholder="#fff">
           <p class="help-block"><code>&lt;input&gt;</code> background color</p>
+          <label>@input-border</label>
+          <input type="text" placeholder="#ccc">
+          <p class="help-block"><code>&lt;input&gt;</code> border color</p>
+          <label>@input-border-radius</label>
+          <input type="text" placeholder="@border-radius-base">
+          <p class="help-block"><code>&lt;input&gt;</code> border radius</p>
           <label>@input-bg-disabled</label>
           <input type="text" placeholder="@gray-lighter">
-          <p class="help-block"><code>&lt;input disabled&gt;</code>background color</p>
-
+          <p class="help-block"><code>&lt;input disabled&gt;</code> background color</p>
+        </div>
+        <div class="col-lg-6">
           <h3>Placeholder</h3>
           <label>@input-color-placeholder</label>
           <input type="text" placeholder="@gray-light">
           <p class="help-block">Placeholder text color</p>
-        </div>
-        <div class="col-lg-6">
-          <h3>Border</h3>
-          <label>@input-border</label>
-          <input type="text" placeholder="#ccc">
-          <p class="help-block"><code>&lt;input&gt;</code> border color</p>
-          <label>@input-border-radius</label>
-          <input type="text" placeholder="@border-radius-base">
-          <p class="help-block"><code>&lt;input&gt;</code>border radius</p>
+
+          <h3>Legend</h3>
+          <label>@legend-border-color</label>
+          <input type="text" placeholder="#e5e5e5">
+          <p class="help-block"><code>&lt;legend&gt;</code> border color</p>
+
+          <h3>Input groups</h3>
+          <label>@input-group-addon-border-color</label>
+          <input type="text" placeholder="@input-border">
+          <p class="help-block">Border color for textual input addons</p>
         </div>
       </div>
 

less/forms.less

@@ -344,7 +344,6 @@ select {
   font-weight: normal;
   line-height: @line-height-base;
   text-align: center;
-  text-shadow: @input-group-addon-text-shadow;
   background-color: @gray-lighter;
   border: 1px solid @input-group-addon-border-color;
   border-radius: @border-radius-base;

less/variables.less

@@ -137,8 +137,7 @@
 
 @legend-border-color:            #e5e5e5;
 
-@input-group-addon-text-shadow:  0 1px 0 #fff;
-@input-group-addon-border-color: #ccc;
+@input-group-addon-border-color: @input-border;
 
 
 // Dropdowns