diff options
author | Mark Otto <otto@github.com> | 2013-05-08 08:56:55 +0400 |
---|---|---|
committer | Mark Otto <otto@github.com> | 2013-05-08 08:56:55 +0400 |
commit | c459c657f8e10ae1af6378114f4943104597c590 (patch) | |
tree | a9bec7b7dd0be9a69957000e1fa66d6f8d0e1952 /less | |
parent | c0e23ad27b7a488f35bcd8bdb29e604823e9a1af (diff) |
Update forms
* Overhaul the form control sizing section to only show sizing via grid columns as parents, not as classes on inputs
* Restore the inline-form option
* Restore the bottom margin on form controls and make them block level instead of inline-block
* More misc docs cleanup for forms
Diffstat (limited to 'less')
-rw-r--r-- | less/forms.less | 28 |
1 files changed, 23 insertions, 5 deletions
diff --git a/less/forms.less b/less/forms.less index 2a1a4e90cf..6162cd4f13 100644 --- a/less/forms.less +++ b/less/forms.less @@ -54,10 +54,10 @@ input[type="url"], input[type="search"], input[type="tel"], input[type="color"] { - display: inline-block; + display: block; min-height: @input-height-base; // Make inputs at least the height of their button counterpart (base line-height + padding + border) padding: 6px 9px; - // margin-bottom: (@line-height-base / 2); + margin-bottom: 10px; font-size: @font-size-base; line-height: @line-height-base; color: @gray; @@ -174,6 +174,7 @@ textarea { min-height: @line-height-base; // clear the floating input if there is no label text margin-bottom: (@line-height-base / 2); padding-left: 20px; + vertical-align: middle; label { display: inline; margin-bottom: 0; @@ -387,14 +388,16 @@ select:focus:invalid { display: table; // Undo padding and float of grid classes - &[class*="span"] { + &.col { float: none; - padding: 0; + padding-left: 0; + padding-right: 0; } input, select { width: 100%; + margin-bottom: 0; } } @@ -404,7 +407,7 @@ select:focus:invalid { .input-group-btn, .input-group input { display: table-cell; - margin: 0; + /*margin: 0;*/ border-radius: 0; &.input-small { border-radius: 0; @@ -515,6 +518,21 @@ select:focus:invalid { +// Inline forms +// -------------------------------------------------- + +.form-inline { + input, + select, + textarea, + .radio, + .checkbox { + display: inline-block; + margin-bottom: 0; + } +} + + // Horizontal forms // -------------------------------------------------- |