From 0e7762240c0854b52decc8c49ea2825abf4b18bd Mon Sep 17 00:00:00 2001 From: Theodore Brown Date: Mon, 11 Dec 2023 16:06:15 -0600 Subject: [PATCH] Fix floating label text cut off in select elements Fixes #33711, fixes #34147 --- scss/_variables.scss | 4 +++- scss/forms/_floating-labels.scss | 4 ++-- 2 files changed, 5 insertions(+), 3 deletions(-) diff --git a/scss/_variables.scss b/scss/_variables.scss index 06531395ea78..b6c0ec379afd 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -1069,11 +1069,13 @@ $form-file-button-hover-bg: var(--#{$prefix}secondary-bg) !default; // scss-docs-start form-floating-variables $form-floating-height: add(3.5rem, $input-height-border) !default; -$form-floating-line-height: 1.25 !default; +$form-floating-line-height: 1.3125 !default; $form-floating-padding-x: $input-padding-x !default; $form-floating-padding-y: 1rem !default; $form-floating-input-padding-t: 1.625rem !default; $form-floating-input-padding-b: .625rem !default; +$form-floating-select-padding-t: 1.25rem !default; +$form-floating-select-padding-b: .25rem !default; $form-floating-label-height: 1.5em !default; $form-floating-label-opacity: .65 !default; $form-floating-label-transform: scale(.85) translateY(-.5rem) translateX(.15rem) !default; diff --git a/scss/forms/_floating-labels.scss b/scss/forms/_floating-labels.scss index ef5a410bf7b8..794a497e2749 100644 --- a/scss/forms/_floating-labels.scss +++ b/scss/forms/_floating-labels.scss @@ -48,8 +48,8 @@ } > .form-select { - padding-top: $form-floating-input-padding-t; - padding-bottom: $form-floating-input-padding-b; + padding-top: $form-floating-select-padding-t; + padding-bottom: $form-floating-select-padding-b; } > .form-control:focus,