diff options
Diffstat (limited to 'docs/base-css.html')
| -rw-r--r-- | docs/base-css.html | 252 |
1 files changed, 128 insertions, 124 deletions
diff --git a/docs/base-css.html b/docs/base-css.html index 60b5640df..8340e0f60 100644 --- a/docs/base-css.html +++ b/docs/base-css.html @@ -1023,66 +1023,68 @@ <div class="row"> <div class="span8"> <form class="form-horizontal"> - <legend>Form control states</legend> - <div class="control-group"> - <label class="control-label" for="focusedInput">Focused input</label> - <div class="controls"> - <input class="input-xlarge focused" id="focusedInput" name="focusedInput" type="text" value="This is focused…"> + <fieldset> + <legend>Form control states</legend> + <div class="control-group"> + <label class="control-label" for="focusedInput">Focused input</label> + <div class="controls"> + <input class="input-xlarge focused" id="focusedInput" name="focusedInput" type="text" value="This is focused…"> + </div> </div> - </div> - <div class="control-group"> - <label class="control-label" for="disabledInput">Disabled input</label> - <div class="controls"> - <input class="input-xlarge disabled" id="disabledInput" name="disabledInput" type="text" placeholder="Disabled input here…" disabled> + <div class="control-group"> + <label class="control-label" for="disabledInput">Disabled input</label> + <div class="controls"> + <input class="input-xlarge disabled" id="disabledInput" name="disabledInput" type="text" placeholder="Disabled input here…" disabled> + </div> </div> - </div> - <div class="control-group"> - <label class="control-label" for="optionsCheckbox">Disabled checkbox</label> - <div class="controls"> - <label class="checkbox"> - <input type="checkbox" name="optionsCheckbox" value="option1" disabled> - This is a disabled checkbox - </label> + <div class="control-group"> + <label class="control-label" for="optionsCheckbox">Disabled checkbox</label> + <div class="controls"> + <label class="checkbox"> + <input type="checkbox" name="optionsCheckbox" value="option1" disabled> + This is a disabled checkbox + </label> + </div> </div> - </div> - <div 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 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> </div> - </div> - <div 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 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> </div> - </div> - <div class="control-group success"> - <label class="control-label" for="inputError">Input with success</label> - <div class="controls"> - <input type="text" name="inputError"> - <span class="help-inline">Woohoo!</span> + <div class="control-group success"> + <label class="control-label" for="inputError">Input with success</label> + <div class="controls"> + <input type="text" name="inputError"> + <span class="help-inline">Woohoo!</span> + </div> </div> - </div> - <div class="control-group success"> - <label class="control-label" for="selectError">Select with success</label> - <div class="controls"> - <select name="selectError"> - <option>1</option> - <option>2</option> - <option>3</option> - <option>4</option> - <option>5</option> - </select> - <span class="help-inline">Woohoo!</span> + <div class="control-group success"> + <label class="control-label" for="selectError">Select with success</label> + <div class="controls"> + <select name="selectError"> + <option>1</option> + <option>2</option> + <option>3</option> + <option>4</option> + <option>5</option> + </select> + <span class="help-inline">Woohoo!</span> + </div> </div> - </div> - <div class="form-actions"> - <button type="submit" class="btn primary">Save changes</button> - <button type="reset" class="btn">Cancel</button> - </div> + <div class="form-actions"> + <button type="submit" class="btn primary">Save changes</button> + <button type="reset" class="btn">Cancel</button> + </div> + </fieldset> </form> </div> <div class="span4"> @@ -1107,85 +1109,87 @@ <div class="row"> <div class="span8"> <form class="form-horizontal"> - <legend>Extending form controls</legend> - <div class="control-group"> - <label class="control-label">Form sizes</label> - <div class="controls docs-input-sizes"> - <input class="span2" type="text" name="" placeholder=".span2"> - <input class="span3" type="text" name="" placeholder=".span3"> - <input class="span4" type="text" name="" placeholder=".span4"> - <p class="help-block">Use the same <code>.span*</code> classes from the grid system for input sizes.</p> + <fieldset> + <legend>Extending form controls</legend> + <div class="control-group"> + <label class="control-label">Form sizes</label> + <div class="controls docs-input-sizes"> + <input class="span2" type="text" name="" placeholder=".span2"> + <input class="span3" type="text" name="" placeholder=".span3"> + <input class="span4" type="text" name="" placeholder=".span4"> + <p class="help-block">Use the same <code>.span*</code> classes from the grid system for input sizes.</p> + </div> </div> - </div> - <div 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="span2" id="prependedInput" name="prependedInput" size="16" type="text"> + <div 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="span2" id="prependedInput" name="prependedInput" size="16" type="text"> + </div> + <p class="help-block">Here's some help text</p> </div> - <p class="help-block">Here's some help text</p> </div> - </div> - <div class="control-group"> - <label class="control-label" for="appendedInput">Appended text</label> - <div class="controls"> - <div class="input-append"> - <input class="span2" id="appendedInput" name="appendedInput" size="16" type="text"> - <span class="add-on">.00</span> + <div class="control-group"> + <label class="control-label" for="appendedInput">Appended text</label> + <div class="controls"> + <div class="input-append"> + <input class="span2" id="appendedInput" name="appendedInput" size="16" type="text"> + <span class="add-on">.00</span> + </div> + <p class="help-block">Here's more help text</p> </div> - <p class="help-block">Here's more help text</p> </div> - </div> - <div class="control-group"> - <label class="control-label" for="inlineCheckboxes">Inline checkboxes</label> - <div class="controls"> - <label class="checkbox inline"> - <input type="checkbox" name="inlineCheckbox1" value="option1"> 1 - </label> - <label class="checkbox inline"> - <input type="checkbox" name="inlineCheckbox1" value="option1"> 2 - </label> - <label class="checkbox inline"> - <input type="checkbox" name="inlineCheckbox1" value="option1"> 3 - </label> + <div class="control-group"> + <label class="control-label" for="inlineCheckboxes">Inline checkboxes</label> + <div class="controls"> + <label class="checkbox inline"> + <input type="checkbox" name="inlineCheckbox1" value="option1"> 1 + </label> + <label class="checkbox inline"> + <input type="checkbox" name="inlineCheckbox1" value="option1"> 2 + </label> + <label class="checkbox inline"> + <input type="checkbox" name="inlineCheckbox1" value="option1"> 3 + </label> + </div> </div> - </div> - <div class="control-group"> - <label class="control-label" for="optionsCheckboxes">Checkboxes</label> - <div class="controls"> - <label class="checkbox"> - <input type="checkbox" name="optionsCheckboxes" value="option1"> - Option one is this and that—be sure to include why it’s great - </label> - <label class="checkbox"> - <input type="checkbox" name="optionsCheckboxes" value="option2"> - Option two can also be checked and included in form results - </label> - <label class="checkbox"> - <input type="checkbox" name="optionsCheckboxes" value="option3"> - Option three can—yes, you guessed it—also be checked and included in form results - </label> - <p class="help-text"><strong>Note:</strong> Labels surround all the options for much larger click areas and a more usable form.</p> + <div class="control-group"> + <label class="control-label" for="optionsCheckboxes">Checkboxes</label> + <div class="controls"> + <label class="checkbox"> + <input type="checkbox" name="optionsCheckboxes" value="option1"> + Option one is this and that—be sure to include why it’s great + </label> + <label class="checkbox"> + <input type="checkbox" name="optionsCheckboxes" value="option2"> + Option two can also be checked and included in form results + </label> + <label class="checkbox"> + <input type="checkbox" name="optionsCheckboxes" value="option3"> + Option three can—yes, you guessed it—also be checked and included in form results + </label> + <p class="help-text"><strong>Note:</strong> Labels surround all the options for much larger click areas and a more usable form.</p> + </div> </div> - </div> - <div class="control-group"> - <label class="control-label" for="optionsRadios">Radio buttons</label> - <div class="controls"> - <label class="radio"> - <input type="radio" checked name="optionsRadios" value="option1"> - Option one is this and that—be sure to include why it’s great - </label> - <label class="radio"> - <input type="radio" name="optionsRadios" value="option2"> - Option two can is something else and selecting it will deselect option one - </label> + <div class="control-group"> + <label class="control-label" for="optionsRadios">Radio buttons</label> + <div class="controls"> + <label class="radio"> + <input type="radio" checked name="optionsRadios" value="option1"> + Option one is this and that—be sure to include why it’s great + </label> + <label class="radio"> + <input type="radio" name="optionsRadios" value="option2"> + Option two can is something else and selecting it will deselect option one + </label> + </div> </div> - </div> - <div class="form-actions"> - <button type="submit" class="btn primary">Save changes</button> - <button type="reset" class="btn">Cancel</button> - </div> + <div class="form-actions"> + <button type="submit" class="btn primary">Save changes</button> + <button type="reset" class="btn">Cancel</button> + </div> + </fieldset> </form> </div> <div class="span4"> |