make form classes match table classes (readable left to right), update docs associated with it

4 files changed, 40 insertions, 38 deletions

diff --git a/bootstrap.css b/bootstrap.css
index c59d49954..c88f4ecaf 100644
--- a/bootstrap.css
+++ b/bootstrap.css
@@ -6,7 +6,7 @@
  * http://www.apache.org/licenses/LICENSE-2.0
  *
  * Designed and built with all the love in the world @twitter by @mdo and @fat.
- * Date: Wed Nov 16 23:58:14 PST 2011
+ * Date: Thu Nov 17 00:05:35 PST 2011
  */
 /* Reset.less
  * Props to Eric Meyer (meyerweb.com) for his CSS reset file. We're using an adapted version here that cuts out some of the reset HTML elements we will never need here (i.e., dfn, samp, etc).
@@ -921,7 +921,7 @@ form .clearfix.success .input-prepend .add-on, form .clearfix.success .input-app
   margin-right: 0;
   margin-left: -1px;
 }
-.form-search .search-query {
+.search-form .search-query {
   -webkit-border-radius: 14px;
   -moz-border-radius: 14px;
   border-radius: 14px;
@@ -932,19 +932,19 @@ form .clearfix.success .input-prepend .add-on, form .clearfix.success .input-app
 .control-group > label {
   font-weight: bold;
 }
-.form-horizontal .control-group > label {
+.horizontal-form .control-group > label {
   float: left;
   width: 130px;
   padding-top: 5px;
   text-align: right;
 }
-.form-horizontal .controls {
+.horizontal-form .controls {
   margin-left: 150px;
 }
-.form-horizontal .control-list {
+.horizontal-form .control-list {
   padding-top: 6px;
 }
-.form-horizontal .form-actions {
+.horizontal-form .form-actions {
   padding-left: 150px;
 }
 /*
diff --git a/bootstrap.min.css b/bootstrap.min.css
index e236547a6..fb3dcd4db 100644
--- a/bootstrap.min.css
+++ b/bootstrap.min.css
@@ -153,13 +153,13 @@ form .clearfix.success .input-prepend .add-on,form .clearfix.success .input-appe
 .input-prepend .add-on{*margin-top:1px;}
 .input-append input{float:left;-webkit-border-radius:3px 0 0 3px;-moz-border-radius:3px 0 0 3px;border-radius:3px 0 0 3px;}
 .input-append .add-on{-webkit-border-radius:0 3px 3px 0;-moz-border-radius:0 3px 3px 0;border-radius:0 3px 3px 0;margin-right:0;margin-left:-1px;}
-.form-search .search-query{-webkit-border-radius:14px;-moz-border-radius:14px;border-radius:14px;}
+.search-form .search-query{-webkit-border-radius:14px;-moz-border-radius:14px;border-radius:14px;}
 .control-group{margin-bottom:18px;}
 .control-group>label{font-weight:bold;}
-.form-horizontal .control-group>label{float:left;width:130px;padding-top:5px;text-align:right;}
-.form-horizontal .controls{margin-left:150px;}
-.form-horizontal .control-list{padding-top:6px;}
-.form-horizontal .form-actions{padding-left:150px;}
+.horizontal-form .control-group>label{float:left;width:130px;padding-top:5px;text-align:right;}
+.horizontal-form .controls{margin-left:150px;}
+.horizontal-form .control-list{padding-top:6px;}
+.horizontal-form .form-actions{padding-left:150px;}
 table{width:100%;padding:0;margin-bottom:18px;font-size:13px;border-collapse:collapse;}table th,table td{padding:10px 10px 9px;line-height:18px;text-align:left;}
 table th{padding-top:9px;font-weight:bold;vertical-align:middle;}
 table td{vertical-align:top;border-top:1px solid #ddd;}
diff --git a/docs/base-css.html b/docs/base-css.html
index 9c1af11c4..0b84d01ad 100644
--- a/docs/base-css.html
+++ b/docs/base-css.html
@@ -696,22 +696,22 @@
     <tbody>
       <tr>
         <th>Vertical (default)</th>
-        <td><code>.form-vertical</code> <span class="muted">(not required)</span></td>
+        <td><code>.vertical-form</code> <span class="muted">(not required)</span></td>
         <td>Stacked, left-aligned labels over controls</td>
       </tr>
       <tr>
         <th>Horiztonal</th>
-        <td><code>.form-horizontal</code></td>
+        <td><code>.horizontal-form</code></td>
         <td>Float left, right-aligned labels on same line as controls</td>
       </tr>
       <tr>
         <th>Inline</th>
-        <td><code>.form-inline</code></td>
+        <td><code>.inline-form</code></td>
         <td>Left-aligned label and inline-block controls for compact style</td>
       </tr>
       <tr>
         <th>Search</th>
-        <td><code>.form-search</code></td>
+        <td><code>.search-form</code></td>
         <td>Extra-rounded text input for a typical search aesthetic</td>
       </tr>
     </tbody>
@@ -734,7 +734,7 @@
     </div>
     <div class="span9">
       <div class="well">
-        <form class="form-search">
+        <form class="search-form">
           <input type="text" class="search-query">
           <button type="submit" class="btn">Search</button>
         </form>
@@ -747,7 +747,7 @@
     </div>
     <div class="span9">
       <div class="well">
-        <form class="form-inline">
+        <form class="inline-form">
           <h4>Some directional text</h4>
           <p>And maybe some kind of optional supporting text right here.</p>
           <input type="text" class="input-medium">
@@ -763,7 +763,7 @@
       <h2>Horizontal form</h2>
     </div>
     <div class="span9">
-      <form class="form-horizontal">
+      <form class="horizontal-form">
         <legend>Example form</legend>
         <fieldset class="control-group">
           <label class="control-label" for="input01">Text input</label>
@@ -867,7 +867,7 @@
       <h2>Vertical form</h2>
     </div>
     <div class="span9">
-      <form class="form-vertical">
+      <form class="vertical-form">
         <legend>Example form</legend>
         <fieldset class="control-group">
           <label class="control-label" for="input01">Label</label>
diff --git a/lib/forms.less b/lib/forms.less
index b7eb15005..adc050d7a 100644
--- a/lib/forms.less
+++ b/lib/forms.less
@@ -364,7 +364,7 @@ form .clearfix.success {
 // SEARCH FORM
 // -----------
 
-.form-search .search-query {
+.search-form .search-query {
   .border-radius(14px);
 }
 
@@ -388,22 +388,24 @@ form .clearfix.success {
 // Horizontal-specific styles
 // --------------------------
 
-// Float the labels left
-.form-horizontal .control-group > label {
-  float: left;
-  width: 130px;
-  padding-top: 5px;
-  text-align: right;
-}
-// Move over all input controls and content
-.form-horizontal .controls {
-  margin-left: 150px;
-}
-// Move the options list down to align with labels
-.form-horizontal .control-list {
-  padding-top: 6px; // has to be padding because margin collaspes
-}
-// Move over buttons in .form-actions to align with .controls
-.form-horizontal .form-actions {
-  padding-left: 150px;
+.horizontal-form {
+  // Float the labels left
+  .control-group > label {
+    float: left;
+    width: 130px;
+    padding-top: 5px;
+    text-align: right;
+  }
+  // Move over all input controls and content
+  .controls {
+    margin-left: 150px;
+  }
+  // Move the options list down to align with labels
+  .control-list {
+    padding-top: 6px; // has to be padding because margin collaspes
+  }
+  // Move over buttons in .form-actions to align with .controls
+  .form-actions {
+    padding-left: 150px;
+  }
 }