From 92122f1944e4caf89d3007d1e3bd559a856a34a4 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 2d70310a516d..ccfc84a65569 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 2cf04704da72..67d11785a6fa 100644 --- a/scss/forms/_floating-labels.scss +++ b/scss/forms/_floating-labels.scss @@ -47,8 +47,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,