diff options
author | Mark Otto <otto@github.com> | 2013-02-03 05:01:29 +0400 |
---|---|---|
committer | Mark Otto <otto@github.com> | 2013-02-03 05:01:29 +0400 |
commit | 04aae2f56cca4438c90232b889fa5a6e1d78d223 (patch) | |
tree | 476659ce34653f92aa1e0c44ee1b2755dd1e669c /less | |
parent | c64aa26d062b53a40be55ea62017bd04f523b290 (diff) | |
parent | 24f0505bde5df08e9e7dd5b96bf0abeaab10901d (diff) |
Merge branch '3.0.0-wip' of https://github.com/gilbarbara/bootstrap into gilbarbara-3.0.0-wip
Diffstat (limited to 'less')
-rw-r--r-- | less/forms.less | 58 | ||||
-rw-r--r-- | less/variables.less | 13 |
2 files changed, 62 insertions, 9 deletions
diff --git a/less/forms.less b/less/forms.less index 0415f217e5..5480419a25 100644 --- a/less/forms.less +++ b/less/forms.less @@ -57,7 +57,7 @@ input[type="color"], .uneditable-input { display: inline-block; .box-sizing(border-box); // Makes inputs behave like true block-level elements - min-height: @input-height; // Make inputs at least the height of their button counterpart (base line-height + padding + border) + 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; font-size: @font-size-base; @@ -134,8 +134,8 @@ input[type="checkbox"] { // Set the height of select and file controls to match text inputs select, input[type="file"] { - height: @input-height; /* In IE7, the height of the select element cannot be changed by height, only font-size. TODO: Check if this is still needed when dropping IE7 support */ - line-height: @input-height; + height: @input-height-base; /* In IE7, the height of the select element cannot be changed by height, only font-size. TODO: Check if this is still needed when dropping IE7 support */ + line-height: @input-height-base; } // Make select elements obey height by applying a border @@ -270,21 +270,22 @@ input[type="tel"], input[type="color"], .uneditable-input { &.input-large { - padding: @padding-large; - padding-left: 14px; - padding-right: 14px; // TODO: Resolve this override + padding: @padding-large-input; font-size: @font-size-large; border-radius: @border-radius-large; + min-height: @input-height-large; } &.input-small { padding: @padding-small; font-size: @font-size-small; border-radius: @border-radius-small; + min-height: @input-height-small; } &.input-mini { padding: @padding-mini; font-size: @font-size-mini; border-radius: @border-radius-small; + min-height: @input-height-small; } } @@ -315,7 +316,7 @@ input[class*="span"], select[class*="span"], textarea[class*="span"], .uneditable-input[class*="span"] { - height: @input-height; + height: @input-height-base; } @@ -447,6 +448,12 @@ select:focus:invalid { display: table-cell; margin: 0; border-radius: 0; + &.input-small { + border-radius: 0; + } + &.input-large { + border-radius: 0; + } } // Addon and addon wrapper for buttons .input-group-addon, @@ -467,6 +474,15 @@ select:focus:invalid { text-shadow: 0 1px 0 #fff; background-color: @grayLighter; border: 1px solid #ccc; + + &.input-small { + padding: @padding-small; + font-size: @font-size-small; + } + &.input-large { + padding: @padding-large-input; + font-size: @font-size-large; + } } // Reset rounded corners @@ -474,6 +490,14 @@ select:focus:invalid { .input-group .uneditable-input:first-child, .input-group-addon:first-child { .border-left-radius(@border-radius-base); + &.input-small { + .border-left-radius(@border-radius-small); + .border-right-radius(0); + } + &.input-large { + .border-left-radius(@border-radius-large); + .border-right-radius(0); + } } .input-group-addon:first-child { border-right: 0; @@ -482,6 +506,14 @@ select:focus:invalid { .input-group .uneditable-input:last-child, .input-group-addon:last-child { .border-right-radius(@border-radius-base); + &.input-small { + .border-right-radius(@border-radius-small); + .border-left-radius(0); + } + &.input-large { + .border-right-radius(@border-radius-large); + .border-left-radius(0); + } } .input-group-addon:last-child { border-left: 0; @@ -512,6 +544,12 @@ select:focus:invalid { &:first-child > .btn, &.btn-group:first-child > .btn { border-radius: @border-radius-base 0 0 @border-radius-base; + &.btn-large { + border-radius:@border-radius-large 0 0 @border-radius-large; + } + &.btn-small { + border-radius:@border-radius-small 0 0 @border-radius-small; + } } } // Append @@ -523,6 +561,12 @@ select:focus:invalid { &:last-child > .btn, &.btn-group:last-child > .btn { border-radius: 0 @border-radius-base @border-radius-base 0; + &.btn-large { + border-radius: 0 @border-radius-large @border-radius-large 0; + } + &.btn-small { + border-radius: 0 @border-radius-small @border-radius-small 0; + } } } diff --git a/less/variables.less b/less/variables.less index 1f8b8ae59d..d72eee21f5 100644 --- a/less/variables.less +++ b/less/variables.less @@ -60,10 +60,14 @@ // ------------------------- // Based on 14px font-size and 1.5 line-height -@padding-large: 11px 19px; // 44px +@padding-large: 11px 14px; // 44px @padding-small: 2px 10px; // 26px @padding-mini: 0 6px; // 22px +@padding-large-input: 10px 14px; // 44px +// firefox hack since it doesn't accept custom line-height for inputs and automatically sets line-height as font-size + 4 px. +// input-large at 18 + 4 = 22, so I tried to compensate on padding. + @border-radius-base: 4px; @border-radius-large: 6px; @border-radius-small: 3px; @@ -115,7 +119,12 @@ @input-color-placeholder: @grayLight; -@input-height: @line-height-base + 14px; // base line-height + 12px vertical padding + 2px top/bottom border +@input-height-base: @line-height-base + 14px; // base line-height + 12px vertical padding + 2px top/bottom border +@input-height-large: @line-height-base + 24px; // base line-height + 22px vertical padding + 2px top/bottom border +@input-height-small: @line-height-base + 6px; // base line-height + 4px vertical padding + 2px top/bottom border + +// adjust min-height on input sizes + @form-actions-background: #f5f5f5; |