diff --git a/src/components/UserLabel/README.md b/src/components/UserLabel/README.md index 1f592f0f3f..191098bacc 100644 --- a/src/components/UserLabel/README.md +++ b/src/components/UserLabel/README.md @@ -97,3 +97,10 @@ LANDING_BLOCK--> | className | Custom CSS class for root element | `string` | | | style | HTML style attribute | `React.CSSProperties` | | | qa | HTML `data-qa` attribute, used in tests | `string` | | + +## CSS API + +| Name | Description | +| :--------------------------- | :--------------- | +| `--g-user-label-font-size` | Text font size | +| `--g-user-label-line-height` | Text line height | diff --git a/src/components/UserLabel/UserLabel.scss b/src/components/UserLabel/UserLabel.scss index d0f57201fd..0a44846819 100644 --- a/src/components/UserLabel/UserLabel.scss +++ b/src/components/UserLabel/UserLabel.scss @@ -4,9 +4,6 @@ $block: '.#{variables.$ns}user-label'; #{$block} { - --_--font-size: var(--g-text-body-1-font-size); - --_--line-height: var(--g-text-body-1-line-height); - $transitionDuration: 0.1s; $transitionTimingFunction: ease-in-out; @@ -80,8 +77,8 @@ $block: '.#{variables.$ns}user-label'; } &__text { - font-size: var(--g-avatar-font-size, var(--_--font-size)); - line-height: var(--g-avatar-line-height, var(--_--line-height)); + font-size: var(--g-user-label-font-size, inherit); + line-height: var(--g-user-label-line-height, inherit); min-width: 0; margin-inline-end: 6px; white-space: nowrap;