Skip to content

Commit 8a18fb6

Browse files
authored
fix: rely on parent flex gap for Field helper-message spacing (#5080)
* fix: align helper-message spacing token across all Field-based inputs Switch .eds-field__helper-message from --eds-spacing-vertical-3xs to --eds-selectable-space-horizontal so all Field-based inputs (TextField, Select, Search, Autocomplete, Checkbox, Radio, Switch) use the same density-aware token as TextArea's .helper-row. Closes #5042 * fix: remove redundant helper-message margin overrides The calc resolves to 0 (--eds-selectable-space-horizontal equals --eds-generic-gap-vertical), so the overrides on .eds-field__helper-message in field.css and on .helper-row + .eds-field__helper-message in textarea.css are no-ops. The helper-message already gets the correct 8px gap from the parent .eds-field flex gap. Addresses PR review feedback on #5080.
1 parent 686fc92 commit 8a18fb6

2 files changed

Lines changed: 1 addition & 13 deletions

File tree

packages/eds-core-react/src/components/next/Field/field.css

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -41,8 +41,8 @@
4141
display: block;
4242

4343
font-size: var(--eds-typography-ui-body-md-font-size);
44-
line-height: var(--eds-typography-ui-body-md-line-height-default);
4544
font-weight: var(--eds-typography-ui-body-md-font-weight-normal);
45+
line-height: var(--eds-typography-ui-body-md-line-height-default);
4646
color: var(--_eds-field-label-color);
4747
}
4848

@@ -62,11 +62,6 @@
6262

6363
.eds-field__helper-message {
6464
margin: 0;
65-
/* Tighten spacing above helper-message to 3xs (overrides parent gap).
66-
Longhand follows shorthand to win the cascade. */
67-
margin-block-start: calc(
68-
var(--eds-spacing-vertical-3xs) - var(--eds-generic-gap-vertical)
69-
);
7065
color: var(--_eds-field-helper-color);
7166
}
7267

packages/eds-core-react/src/components/next/TextArea/textarea.css

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -39,13 +39,6 @@
3939
gap: var(--eds-typography-gap-horizontal);
4040
align-items: baseline;
4141
inline-size: 100%;
42-
margin-block-start: calc(
43-
var(--eds-selectable-space-horizontal) - var(--eds-generic-gap-vertical)
44-
);
45-
}
46-
47-
& .eds-field__helper-message {
48-
margin-block-start: 0;
4942
}
5043

5144
& .char-count {

0 commit comments

Comments
 (0)