diff options
| -rw-r--r-- | scss/_forms.scss | 28 | ||||
| -rw-r--r-- | scss/_input-group.scss | 12 |
2 files changed, 23 insertions, 17 deletions
diff --git a/scss/_forms.scss b/scss/_forms.scss index c079bd5c4..5530630ed 100644 --- a/scss/_forms.scss +++ b/scss/_forms.scss @@ -7,6 +7,7 @@ .form-control { display: block; width: 100%; + height: $input-height; padding: $input-padding-y $input-padding-x; font-size: $font-size-base; line-height: $input-line-height; @@ -57,10 +58,6 @@ } select.form-control { - &:not([size]):not([multiple]) { - height: $input-height; - } - &:focus::-ms-value { // Suppress the nested default white text on blue background highlight given to // the selected option text when the (still closed) <select> receives focus @@ -139,35 +136,36 @@ select.form-control { // Build on `.form-control` with modifier classes to decrease or increase the // height and font-size of form controls. // -// The `.form-group-* form-control` variations are sadly duplicated to avoid the -// issue documented in https://github.com/twbs/bootstrap/issues/15074. +// Repeated in `_input_group.scss` to avoid Sass extend issues. .form-control-sm { + height: $input-height-sm; padding: $input-padding-y-sm $input-padding-x-sm; font-size: $font-size-sm; line-height: $input-line-height-sm; @include border-radius($input-border-radius-sm); } -select.form-control-sm { - &:not([size]):not([multiple]) { - height: $input-height-sm; - } -} - .form-control-lg { + height: $input-height-lg; padding: $input-padding-y-lg $input-padding-x-lg; font-size: $font-size-lg; line-height: $input-line-height-lg; @include border-radius($input-border-radius-lg); } -select.form-control-lg { - &:not([size]):not([multiple]) { - height: $input-height-lg; +// stylelint-disable no-duplicate-selectors +select.form-control { + &[size], + &[multiple] { + height: auto; } } +textarea.form-control { + height: auto; +} +// stylelint-enable no-duplicate-selectors // Form groups // diff --git a/scss/_input-group.scss b/scss/_input-group.scss index a8b0e59ed..c210242a1 100644 --- a/scss/_input-group.scss +++ b/scss/_input-group.scss @@ -122,7 +122,11 @@ .input-group-lg > .input-group-append > .input-group-text, .input-group-lg > .input-group-prepend > .btn, .input-group-lg > .input-group-append > .btn { - @extend .form-control-lg; + height: $input-height-lg; + padding: $input-padding-y-lg $input-padding-x-lg; + font-size: $font-size-lg; + line-height: $input-line-height-lg; + @include border-radius($input-border-radius-lg); } .input-group-sm > .form-control, @@ -130,7 +134,11 @@ .input-group-sm > .input-group-append > .input-group-text, .input-group-sm > .input-group-prepend > .btn, .input-group-sm > .input-group-append > .btn { - @extend .form-control-sm; + height: $input-height-sm; + padding: $input-padding-y-sm $input-padding-x-sm; + font-size: $font-size-sm; + line-height: $input-line-height-sm; + @include border-radius($input-border-radius-sm); } |