add docs for alt form control sizing per #1700

docs/base-css.html

@@ -1121,7 +1121,7 @@ For example, <code>section</code> should be wrapped as inline.
         <fieldset>
           <legend>Extending form controls</legend>
           <div class="control-group">
-            <label class="control-label">Form sizes</label>
+            <label class="control-label">Form grid sizes</label>
             <div class="controls docs-input-sizes">
               <input class="span1" type="text" placeholder=".span1">
               <input class="span2" type="text" placeholder=".span2">
@@ -1150,6 +1150,15 @@ For example, &lt;code&gt;section&lt;/code&gt; should be wrapped as inline.
               <p class="help-block">Use the same <code>.span*</code> classes from the grid system for input sizes.</p>
             </div>
           </div>
+          <div class="control-group">
+            <label class="control-label">Alternate sizes</label>
+            <div class="controls docs-input-sizes">
+              <input class="input-mini" type="text" placeholder=".input-mini">
+              <input class="input-small" type="text" placeholder=".input-small">
+              <input class="input-medium" type="text" placeholder=".input-medium">
+              <p class="help-block">You may also use static classes that don't map to the grid, adapt to the responsive CSS styles, or account for varying types of controls (e.g., <code>input</code> vs. <code>select</code>).</p>
+            </div>
+          </div>          
           <div class="control-group">
             <label class="control-label" for="prependedInput">Prepended text</label>
             <div class="controls">

docs/templates/pages/base-css.mustache

@@ -1045,7 +1045,7 @@
         <fieldset>
           <legend>{{_i}}Extending form controls{{/i}}</legend>
           <div class="control-group">
-            <label class="control-label">{{_i}}Form sizes{{/i}}</label>
+            <label class="control-label">{{_i}}Form grid sizes{{/i}}</label>
             <div class="controls docs-input-sizes">
               <input class="span1" type="text" placeholder=".span1">
               <input class="span2" type="text" placeholder=".span2">
@@ -1074,6 +1074,15 @@
               <p class="help-block">{{_i}}Use the same <code>.span*</code> classes from the grid system for input sizes.{{/i}}</p>
             </div>
           </div>
+          <div class="control-group">
+            <label class="control-label">{{_i}}Alternate sizes{{/i}}</label>
+            <div class="controls docs-input-sizes">
+              <input class="input-mini" type="text" placeholder=".input-mini">
+              <input class="input-small" type="text" placeholder=".input-small">
+              <input class="input-medium" type="text" placeholder=".input-medium">
+              <p class="help-block">{{_i}}You may also use static classes that don't map to the grid, adapt to the responsive CSS styles, or account for varying types of controls (e.g., <code>input</code> vs. <code>select</code>).{{/i}}</p>
+            </div>
+          </div>          
           <div class="control-group">
             <label class="control-label" for="prependedInput">{{_i}}Prepended text{{/i}}</label>
             <div class="controls">