From 8a7abc7493a07935d4d91b2cc56a82523fd53970 Mon Sep 17 00:00:00 2001
From: Mark Otto <markdotto@gmail.com>
Date: Wed, 21 Dec 2011 16:00:50 -0600
Subject: docs updates, forms updated to include error states and more
 examples, remove text-shadow from gradientbar mixin to fix bug

---
 docs/base-css.html | 80 ++++++++++++++++++++++++++++++++++++++++++++++++++----
 1 file changed, 74 insertions(+), 6 deletions(-)

(limited to 'docs/base-css.html')

diff --git a/docs/base-css.html b/docs/base-css.html
index 209897402..63ec53306 100644
--- a/docs/base-css.html
+++ b/docs/base-css.html
@@ -762,6 +762,43 @@
     <h1>Forms</h1>
   </div>
 
+<!--
+
+Types of forms
+  default (stacked)
+  horizontal (change the class)
+  search
+  inline
+Form elements
+  form
+  fieldset
+  legend
+  label
+  input
+    text (password, email, etc)
+    radio
+    checkbox
+  textarea
+    rows
+  select
+    single
+    multiple
+    size
+Custom form elements
+  Input prepend and append (for @ and $)
+  checkbox and radio lists
+Explaining the default Bootstrap form structure
+  Bulletproofing our forms means adding a bit of extra structure and providing more classes for customization and event handling
+  Form vertical and horizontal forms, we require a wrapping element.
+    we suggest a fieldset
+    but could be anthing so long as it uses the proper class
+Form states
+  warning
+  error
+  success
+
+-->
+
   <h2>Four types of forms</h2>
   <table class="bordered-table striped-table">
     <thead>
@@ -842,7 +879,7 @@
     </div>
     <div class="span9">
       <form class="horizontal-form">
-        <legend>Example form</legend>
+        <legend>Example form section</legend>
         <fieldset class="control-group">
           <label class="control-label" for="input01">Text input</label>
           <div class="controls">
@@ -850,6 +887,16 @@
             <p class="help-text">Help text here. Be sure to fill this out like so, or else!</p>
           </div>
         </fieldset>
+        <fieldset class="control-group">
+          <label class="control-label" for="prependedInput">Prepended text</label>
+          <div class="controls">
+            <div class="input-prepend">
+              <span class="add-on">@</span>
+              <input class="input-small" id="prependedInput" name="prependedInput" size="16" type="text">
+            </div>
+            <span class="help-block">Here's some help text</span>
+          </div>
+        </fieldset>
         <fieldset class="control-group">
           <label class="control-label" for="select01">Select list</label>
           <div class="controls">
@@ -874,23 +921,44 @@
             </select>
           </div>
         </fieldset>
-        <legend>Example form</legend>
+        <legend>Example form section</legend>
+        <fieldset class="control-group">
+          <label class="control-label" for="textarea">Textarea</label>
+          <div class="controls">
+            <textarea class="input-xlarge" name="textarea" id="textarea" rows="3"></textarea>
+          </div>
+        </fieldset>
+        <fieldset class="control-group">
+          <label class="control-label" for="fileInput">Disabled input</label>
+          <div class="controls">
+            <input class="input-xlarge disabled" id="disabledInput" name="disabledInput" size="30" type="text" placeholder="Disabled input here... carry on." disabled>
+          </div>
+        </fieldset>
         <fieldset class="control-group">
           <label class="control-label" for="fileInput">File input</label>
           <div class="controls">
             <input class="input-file" id="fileInput" name="fileInput" type="file">
           </div>
         </fieldset>
-        <fieldset class="control-group has-error">
+        <fieldset class="control-group warning">
+          <label class="control-label" for="inputError">Input with warning</label>
+          <div class="controls">
+            <input type="text" name="inputError">
+            <span class="help-inline">Something may have gone wrong</span>
+          </div>
+        </fieldset>
+        <fieldset class="control-group error">
           <label class="control-label" for="inputError">Input with error</label>
           <div class="controls">
             <input type="text" name="inputError">
+            <span class="help-inline">Please correct the error</span>
           </div>
         </fieldset>
-        <fieldset class="control-group has-error">
-          <label class="control-label" for="textareaError">Textarea with error</label>
+        <fieldset class="control-group success">
+          <label class="control-label" for="inputError">Input with success</label>
           <div class="controls">
-            <textarea class="input-xlarge" rows="3"></textarea>
+            <input type="text" name="inputError">
+            <span class="help-inline">Woohoo!</span>
           </div>
         </fieldset>
         <fieldset class="control-group">
-- 
cgit v1.2.3