remove form docs from the styles and markup, it's no longer needed

diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index efd22199156ae36ded4125b8ccf22c5acd7efa9c..c96818a5642b0a7543c0b4770c56d5edfbb7b7e7 100644 (file)
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -943,9 +943,20 @@ input:focus:required:invalid:focus, textarea:focus:required:invalid:focus, selec
   display: inline-block;
   margin-bottom: 0;
 }
-.form-search label, .form-inline label {
+.form-search label,
+.form-inline label,
+.form-search .input-append,
+.form-inline .input-append,
+.form-search .input-prepend,
+.form-inline .input-prepend {
   display: inline-block;
 }
+.form-search .input-append .add-on,
+.form-inline .input-prepend .add-on,
+.form-search .input-append .add-on,
+.form-inline .input-prepend .add-on {
+  vertical-align: middle;
+}
 .control-group {
   margin-bottom: 9px;
 }

diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css
index 9b8244d49b7e18161f8f49b483d1f7a2c64176f6..74b548628514e6ef03266aa589304bb9e5a819db 100644 (file)
--- a/docs/assets/css/docs.css
+++ b/docs/assets/css/docs.css
@@ -543,19 +543,6 @@ form.well {
   margin: 18px 0;
 }
 
-/* Form docs for horizontal forms */
-.form-docs {
-  padding-left: 10px;
-}
-.form-docs h3,
-.form-docs p,
-.form-docs li {
-  color: #777;
-}
-.form-docs hr {
-  margin: 18px 0;
-}
-
 /* Fake the :focus state to demo it */
 .focused {
   border-color: rgba(82,168,236,.8);
@@ -689,10 +676,6 @@ form.well {
     left: auto;
   }
 
-  /* Forms docs */
-  .form-docs {
-    padding-left: 0; /* down from 10px */
-  }
 }
 
 

diff --git a/docs/base-css.html b/docs/base-css.html
index 4651e9789c8995041ce7793ffbe02d059348ee91..3b4032805fd79e8d256296e43a0ca7d73f323c51 100644 (file)
--- a/docs/base-css.html
+++ b/docs/base-css.html
@@ -952,22 +952,20 @@ For example, <code>section</code> should be wrapped as inline.
       </form>
     </div>
     <div class="span4">
-      <div class="form-docs">
-        <h3>What's included</h3>
-        <p>Shown on the left are all the default form controls we support. Here's the bulleted list:</p>
-        <ul>
-          <li>text inputs (text, password, email, etc)</li>
-          <li>checkbox</li>
-          <li>radio</li>
-          <li>select</li>
-          <li>multiple select</li>
-          <li>file input</li>
-          <li>textarea</li>
-        </ul>
-        <hr>
-        <h3>New defaults with v2.0</h3>
-        <p>Up to v1.4, Bootstrap's default form styles used the horizontal layout. With Bootstrap 2, we removed that constraint to have smarter, more scalable defaults for any form.</p>
-      </div>
+      <h3>What's included</h3>
+      <p>Shown on the left are all the default form controls we support. Here's the bulleted list:</p>
+      <ul>
+        <li>text inputs (text, password, email, etc)</li>
+        <li>checkbox</li>
+        <li>radio</li>
+        <li>select</li>
+        <li>multiple select</li>
+        <li>file input</li>
+        <li>textarea</li>
+      </ul>
+      <hr>
+      <h3>New defaults with v2.0</h3>
+      <p>Up to v1.4, Bootstrap's default form styles used the horizontal layout. With Bootstrap 2, we removed that constraint to have smarter, more scalable defaults for any form.</p>
     </div>
   </div>
 
@@ -1047,19 +1045,17 @@ For example, &lt;code&gt;section&lt;/code&gt; should be wrapped as inline.
       </form>
     </div>
     <div class="span4">
-      <div class="form-docs">
-        <h3>Redesigned browser states</h3>
-        <p>Bootstrap features styles for browser-supported focused and <code>disabled</code> states. We remove the default Webkit <code>outline</code> and apply a <code>box-shadow</code> in it's place for <code>:focus</code>.</p>
-        <hr>
-        <h3>Form validation</h3>
-        <p>It also includes validation styles for errors, warnings, and success. To use, add the a class to the surrounding <code>.control-group</code>.</p>
+      <h3>Redesigned browser states</h3>
+      <p>Bootstrap features styles for browser-supported focused and <code>disabled</code> states. We remove the default Webkit <code>outline</code> and apply a <code>box-shadow</code> in it's place for <code>:focus</code>.</p>
+      <hr>
+      <h3>Form validation</h3>
+      <p>It also includes validation styles for errors, warnings, and success. To use, add the a class to the surrounding <code>.control-group</code>.</p>
 <pre class="prettyprint linenums">
 &lt;fieldset
   class="control-group error"&gt;
   …
 &lt;/fieldset&gt;
 </pre>
-      </div>
     </div>
   </div>
 
@@ -1152,14 +1148,15 @@ For example, &lt;code&gt;section&lt;/code&gt; should be wrapped as inline.
       </form>
     </div>
     <div class="span4">
-      <div class="form-docs">
-        <h3>Prepend &amp; append inputs</h3>
-        <p>Input groups&mdash;with appended or prepended text&mdash;provide an easy way to give more context for your inputs. Great examples include the @ sign for Twitter usernames or $ for finances.</p>
-        <hr>
-        <h3>Checkboxes and radios</h3>
-        <p>Up to v1.4, Bootstrap required extra markup around checkboxes and radios to stack them. Now, it's a simple matter of repeating the <code>&lt;label class="checkbox"&gt;</code> that wraps the <code>&lt;input type="checkbox"&gt;</code>.</p>
-        <p>Inline checkboxes and radios are also supported. Just add <code>.inline</code> to any <code>.checkbox</code> or <code>.radio</code> and you're done.</p>
-      </div>
+      <h3>Prepend &amp; append inputs</h3>
+      <p>Input groups&mdash;with appended or prepended text&mdash;provide an easy way to give more context for your inputs. Great examples include the @ sign for Twitter usernames or $ for finances.</p>
+      <hr>
+      <h3>Checkboxes and radios</h3>
+      <p>Up to v1.4, Bootstrap required extra markup around checkboxes and radios to stack them. Now, it's a simple matter of repeating the <code>&lt;label class="checkbox"&gt;</code> that wraps the <code>&lt;input type="checkbox"&gt;</code>.</p>
+      <p>Inline checkboxes and radios are also supported. Just add <code>.inline</code> to any <code>.checkbox</code> or <code>.radio</code> and you're done.</p>
+      <hr>
+      <h4>Inline forms and append/prepend</h4>
+      <p>To use prepend or append inputs in an inline form, be sure to place the <code>.add-on</code> and <code>input</code> on the same line, without spaces.</p>
     </div>
   </div><!-- /row -->
 </section>

diff --git a/docs/templates/pages/base-css.mustache b/docs/templates/pages/base-css.mustache
index c15fcebd3957d7f5d25c2c4a1bd1377df5048f45..b464084dfe7811ba19984686aae29b9f226e24d4 100644 (file)
--- a/docs/templates/pages/base-css.mustache
+++ b/docs/templates/pages/base-css.mustache
@@ -880,22 +880,20 @@
       </form>
     </div>
     <div class="span4">
-      <div class="form-docs">
-        <h3>{{_i}}What's included{{/i}}</h3>
-        <p>{{_i}}Shown on the left are all the default form controls we support. Here's the bulleted list:{{/i}}</p>
-        <ul>
-          <li>{{_i}}text inputs (text, password, email, etc){{/i}}</li>
-          <li>{{_i}}checkbox{{/i}}</li>
-          <li>{{_i}}radio{{/i}}</li>
-          <li>{{_i}}select{{/i}}</li>
-          <li>{{_i}}multiple select{{/i}}</li>
-          <li>{{_i}}file input{{/i}}</li>
-          <li>{{_i}}textarea{{/i}}</li>
-        </ul>
-        <hr>
-        <h3>{{_i}}New defaults with v2.0{{/i}}</h3>
-        <p>{{_i}}Up to v1.4, Bootstrap's default form styles used the horizontal layout. With Bootstrap 2, we removed that constraint to have smarter, more scalable defaults for any form.{{/i}}</p>
-      </div>
+      <h3>{{_i}}What's included{{/i}}</h3>
+      <p>{{_i}}Shown on the left are all the default form controls we support. Here's the bulleted list:{{/i}}</p>
+      <ul>
+        <li>{{_i}}text inputs (text, password, email, etc){{/i}}</li>
+        <li>{{_i}}checkbox{{/i}}</li>
+        <li>{{_i}}radio{{/i}}</li>
+        <li>{{_i}}select{{/i}}</li>
+        <li>{{_i}}multiple select{{/i}}</li>
+        <li>{{_i}}file input{{/i}}</li>
+        <li>{{_i}}textarea{{/i}}</li>
+      </ul>
+      <hr>
+      <h3>{{_i}}New defaults with v2.0{{/i}}</h3>
+      <p>{{_i}}Up to v1.4, Bootstrap's default form styles used the horizontal layout. With Bootstrap 2, we removed that constraint to have smarter, more scalable defaults for any form.{{/i}}</p>
     </div>
   </div>
 
@@ -975,19 +973,17 @@
       </form>
     </div>
     <div class="span4">
-      <div class="form-docs">
-        <h3>{{_i}}Redesigned browser states{{/i}}</h3>
-        <p>{{_i}}Bootstrap features styles for browser-supported focused and <code>disabled</code> states. We remove the default Webkit <code>outline</code> and apply a <code>box-shadow</code> in it's place for <code>:focus</code>.{{/i}}</p>
-        <hr>
-        <h3>{{_i}}Form validation{{/i}}</h3>
-        <p>{{_i}}It also includes validation styles for errors, warnings, and success. To use, add the a class to the surrounding <code>.control-group</code>.{{/i}}</p>
+      <h3>{{_i}}Redesigned browser states{{/i}}</h3>
+      <p>{{_i}}Bootstrap features styles for browser-supported focused and <code>disabled</code> states. We remove the default Webkit <code>outline</code> and apply a <code>box-shadow</code> in it's place for <code>:focus</code>.{{/i}}</p>
+      <hr>
+      <h3>{{_i}}Form validation{{/i}}</h3>
+      <p>{{_i}}It also includes validation styles for errors, warnings, and success. To use, add the a class to the surrounding <code>.control-group</code>.{{/i}}</p>
 <pre class="prettyprint linenums">
 &lt;fieldset
   class="control-group error"&gt;
   …
 &lt;/fieldset&gt;
 </pre>
-      </div>
     </div>
   </div>
 
@@ -1080,14 +1076,15 @@
       </form>
     </div>
     <div class="span4">
-      <div class="form-docs">
-        <h3>{{_i}}Prepend &amp; append inputs{{/i}}</h3>
-        <p>{{_i}}Input groups&mdash;with appended or prepended text&mdash;provide an easy way to give more context for your inputs. Great examples include the @ sign for Twitter usernames or $ for finances.{{/i}}</p>
-        <hr>
-        <h3>{{_i}}Checkboxes and radios{{/i}}</h3>
-        <p>{{_i}}Up to v1.4, Bootstrap required extra markup around checkboxes and radios to stack them. Now, it's a simple matter of repeating the <code>&lt;label class="checkbox"&gt;</code> that wraps the <code>&lt;input type="checkbox"&gt;</code>.{{/i}}</p>
-        <p>{{_i}}Inline checkboxes and radios are also supported. Just add <code>.inline</code> to any <code>.checkbox</code> or <code>.radio</code> and you're done.{{/i}}</p>
-      </div>
+      <h3>{{_i}}Prepend &amp; append inputs{{/i}}</h3>
+      <p>{{_i}}Input groups&mdash;with appended or prepended text&mdash;provide an easy way to give more context for your inputs. Great examples include the @ sign for Twitter usernames or $ for finances.{{/i}}</p>
+      <hr>
+      <h3>{{_i}}Checkboxes and radios{{/i}}</h3>
+      <p>{{_i}}Up to v1.4, Bootstrap required extra markup around checkboxes and radios to stack them. Now, it's a simple matter of repeating the <code>&lt;label class="checkbox"&gt;</code> that wraps the <code>&lt;input type="checkbox"&gt;</code>.{{/i}}</p>
+      <p>{{_i}}Inline checkboxes and radios are also supported. Just add <code>.inline</code> to any <code>.checkbox</code> or <code>.radio</code> and you're done.{{/i}}</p>
+      <hr>
+      <h4>{{_i}}Inline forms and append/prepend{{/i}}</h4>
+      <p>{{_i}}To use prepend or append inputs in an inline form, be sure to place the <code>.add-on</code> and <code>input</code> on the same line, without spaces.{{/i}}</p>
     </div>
   </div><!-- /row -->
 </section>

diff --git a/less/forms.less b/less/forms.less
index 69ddbcac93a375c6aa3bd45f562e67d24365f0c6..6b0f5ec52ec67e6ac27dfa3fdf2e1771268b87a0 100644 (file)
--- a/less/forms.less
+++ b/less/forms.less
@@ -495,9 +495,20 @@ select:focus:required:invalid {
   }
 }
 .form-search label,
-.form-inline label {
+.form-inline label,
+.form-search .input-append,
+.form-inline .input-append,
+.form-search .input-prepend,
+.form-inline .input-prepend {
   display: inline-block;
 }
+// Make the prepend and append add-on vertical-align: middle;
+.form-search .input-append .add-on,
+.form-inline .input-prepend .add-on,
+.form-search .input-append .add-on,
+.form-inline .input-prepend .add-on {
+  vertical-align: middle;
+}
 
 // Margin to space out fieldsets
 .control-group {