fix(label): only thicken border on link hover, not close button#3104
fix(label): only thicken border on link hover, not close button#3104bennypowers merged 3 commits intomainfrom
Conversation
Use #container:has(#link:hover) instead of :host(:hover) so the border only thickens when hovering the link text itself, not when hovering the close button. Matches PFv4 behavior. Assisted-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
|
✅ Deploy Preview for patternfly-elements ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
✅ Commitlint tests passed!More Info{
"valid": true,
"errors": [],
"warnings": [],
"input": "fix(label): only thicken border on link hover, not close button"
} |
This comment has been minimized.
This comment has been minimized.
adamjohnson
left a comment
adamjohnson
left a comment
There was a problem hiding this comment.
Here's what the focus state looks like in PF Label:
And here's what it looks like in PFE Label:
The focus outline is getting cut off. This can be fixed by removing overflow: hidden; on the #container. That said, there may be other side effects to removing that.
More or less, this LGTM and, if you deem it fit, removing the overflow: hidden; is a nice add.
Replace overflow: hidden with overflow: clip and overflow-clip-margin so focus outlines on the close button are not clipped. Assisted-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
adamjohnson
left a comment
adamjohnson
left a comment
There was a problem hiding this comment.
Links Get Tactile Markers
2 participants
Summary
Use
#container:has(#link:hover)instead of:host(:hover)so theborder only thickens when hovering the link text, not the close button.
Matches PFv4 behavior per @adamjohnson's review on #3095.
Test plan