diff --git a/src/components/form-field/form-field/form-field.scss b/src/components/form-field/form-field/form-field.scss index 9f637eddad..75eee093a6 100644 --- a/src/components/form-field/form-field/form-field.scss +++ b/src/components/form-field/form-field/form-field.scss @@ -28,13 +28,16 @@ --sbb-form-field-label-size: calc( var(--sbb-form-field-label-text-size) * var(--sbb-typo-line-height-body-text) ); - --sbb-form-field-input-size: calc( + --sbb-form-field-text-size: calc( var(--sbb-form-field-input-text-size) * var(--sbb-typo-line-height-body-text) ); + + // fixme +2px to not cut low underscore letters + --sbb-form-field-input-size: calc(var(--sbb-form-field-input-text-size) + 2px); --sbb-form-field-margin-block-start: calc( ( var(--sbb-form-field-min-height) - var(--sbb-form-field-label-size) - var( - --sbb-form-field-input-size + --sbb-form-field-text-size ) + var(--sbb-form-field-label-to-input-overlapping) ) / 2 ); @@ -91,9 +94,6 @@ --sbb-form-field-padding-inline: var(--sbb-spacing-fixed-2x); --sbb-form-field-input-text-size: var(--sbb-font-size-text-s); --sbb-form-field-label-text-size: var(--sbb-font-size-text-xxs); - - // fixme +2px to not cut low underscore letters - --sbb-form-field-input-size2: calc(var(--sbb-form-field-input-text-size) + 2px); --sbb-form-field-label-to-input-overlapping: #{sbb.px-to-rem-build(10)}; --sbb-form-field-spacer-margin-block-end: #{sbb.px-to-rem-build(-11)}; --sbb-form-field-floating-label-transform: #{sbb.px-to-rem-build(5.125)}; @@ -421,7 +421,7 @@ font-size: var(--sbb-form-field-input-text-size) !important; font-family: var(--sbb-typo-font-family) !important; line-height: var(--sbb-typo-line-height-body-text) !important; - height: var(--sbb-form-field-input-size2); + height: var(--sbb-form-field-input-size); &::placeholder { @include sbb.placeholder;