diff options
| author | Mark Otto <[email protected]> | 2013-05-02 22:52:32 -0700 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2013-05-02 22:54:14 -0700 |
| commit | bec8c90fd7a126e23c1d3a66eba9782b32729e48 (patch) | |
| tree | b4b122ee56eb119e96c77d02155ba15154cbac15 | |
| parent | a4f2c9e156ed52e24ea779b8ef4a32adfb124444 (diff) | |
| download | bootstrap-bec8c90fd7a126e23c1d3a66eba9782b32729e48.tar.xz bootstrap-bec8c90fd7a126e23c1d3a66eba9782b32729e48.zip | |
Cleanup .navbar-form styles
* Nuke the commented out navbar forms code that's not currently needed
* Add a few more examples to the .navbar-form docs section
* Remove (for now at least) top padding on checkbox and radios
| -rw-r--r-- | docs/docs.html | 32 | ||||
| -rw-r--r-- | less/forms.less | 4 | ||||
| -rw-r--r-- | less/navbar.less | 31 |
3 files changed, 35 insertions, 32 deletions
diff --git a/docs/docs.html b/docs/docs.html index 4292b650c..2b922b695 100644 --- a/docs/docs.html +++ b/docs/docs.html @@ -3476,12 +3476,44 @@ For example, <code><section></code> should be wrapped as inline. <h3 id="navbar-forms">Forms</h3> <p>To properly style and position a form within the navbar, add the appropriate classes as shown below. For a default form, include <code>.navbar-form</code> and either <code>.pull-left</code> or <code>.pull-right</code> to properly align it.</p> <div class="bs-docs-example"> + + <div class="navbar"> + <form class="navbar-form pull-left"> + <input type="text" style="width: 200px;"> + <button type="submit" class="btn">Submit</button> + </form> + </div> + + <div class="navbar"> + <form class="navbar-form pull-left"> + <select name="" id="" style="width: 200px;"> + <option value="1">1</option> + <option value="1">1</option> + <option value="1">1</option> + <option value="1">1</option> + </select> + <button type="submit" class="btn">Submit</button> + </form> + </div> + + <div class="navbar"> + <form class="navbar-form pull-left"> + <input type="text" style="width: 200px;"> + <input type="checkbox"> + <button type="submit" class="btn">Submit</button> + </form> + </div> + <div class="navbar"> <form class="navbar-form pull-left"> <input type="text" style="width: 200px;"> + <label class="checkbox-inline"> + <input type="checkbox"> Derp + </label> <button type="submit" class="btn">Submit</button> </form> </div> + </div><!-- /example --> {% highlight html %} <form class="navbar-form pull-left"> diff --git a/less/forms.less b/less/forms.less index 72eab570d..fb0a41dd8 100644 --- a/less/forms.less +++ b/less/forms.less @@ -193,17 +193,19 @@ textarea { margin-top: ((@line-height-base / 4) * -1); } +/* // Move the options list down to align with labels .controls > .radio:first-child, .controls > .checkbox:first-child { padding-top: 5px; // has to be padding because margin collaspes } +*/ // Radios and checkboxes on same line .radio-inline, .checkbox-inline { display: inline-block; - padding-top: 5px; +// padding-top: 5px; padding-left: 20px; margin-bottom: 0; vertical-align: middle; diff --git a/less/navbar.less b/less/navbar.less index 662887032..e5e3acd59 100644 --- a/less/navbar.less +++ b/less/navbar.less @@ -336,36 +336,5 @@ margin-top: 0; // then undo the margin here so we don't accidentally double it } -// Navbar forms -// ------------------------- -.navbar-form { - margin-bottom: 0; // remove default bottom margin - .clearfix(); - input, - select, - .radio, - .checkbox { - .navbarVerticalAlign(30px); // Vertically center in navbar - } - input, - select, - .btn { - display: inline-block; - margin-bottom: 0; - } - input[type="image"], - input[type="checkbox"], - input[type="radio"] { - margin-top: 3px; - } - .input-append, - .input-prepend { - margin-top: 5px; - white-space: nowrap; // preven two items from separating within a .navbar-form that has .pull-left - input { - margin-top: 0; // remove the margin on top since it's on the parent - } - } -} */ |
