Skip to content

[UIK-4866] Small link/button-link underline style fix#2766

Merged
sheila-semrush merged 6 commits intoUIK-4841/button-link-underline-v-17from
UIK-4866/underline-style-fixes
Mar 4, 2026
Merged

[UIK-4866] Small link/button-link underline style fix#2766
sheila-semrush merged 6 commits intoUIK-4841/button-link-underline-v-17from
UIK-4866/underline-style-fixes

Conversation

@sheila-semrush
Copy link
Contributor

@sheila-semrush sheila-semrush commented Mar 3, 2026

Motivation and Context

  • simplified underlining styles (moved underline slightly closer to text)
  • removed bottom-padding — I think it's not needed now, but I'm not sure I remember correctly for which case it was added
  • fixed text-decoration-thickness not applying in secondary button link
  • added explicit size to some link examples (underlining is cropped without set line-height)

How has this been tested?

Manually.
Not uploading snapshots here because they haven't been updated in the parent branch, so they would contain some other changes apart from these.

Types of changes

  • Bug fix (non-breaking change which fixes an issue).
  • New feature (non-breaking change which adds functionality).
  • Breaking change (fix or feature that would cause existing functionality to not work as expected).
  • Nice improve.

Checklist:

  • I have updated the documentation accordingly.
  • I have added new tests on added of fixed functionality.


SText {
text-decoration: underline;
text-decoration-line: underline;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

why do you use text-decoration-line here and without -line in Link?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

here text-decoration in the shorthand form caused text-decoration-thickness to not apply, in link there's no such problem, but we can do the same there for consistency. It's probably better to not mix shorthands and single attributes anyway

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

actually no, I was wrong, the problem with thickness was only in the secondary use, and what fixed it was removing text-decoration: underline from SButton[use='secondary'] SText due to order of rules. So I will roll back this change

@ilyabrower
Copy link
Contributor

ilyabrower commented Mar 4, 2026

  • removed bottom-padding — I think it's not needed now, but I'm not sure I remember correctly for which case it was added

Did you check it with ellipsis settings? It will enable overflow: hidden

<Link.Text w={w} ellipsis>{text} ellipsis</Link.Text>
</Link>
</Text>
<Text tag='div' mt={3} size={size}>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

maybe it's better to remove this to render both links on the same line?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

fixed

@sheila-semrush sheila-semrush merged commit aa42615 into UIK-4841/button-link-underline-v-17 Mar 4, 2026
4 checks passed
@sheila-semrush sheila-semrush deleted the UIK-4866/underline-style-fixes branch March 4, 2026 14:01
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment