Skip to content

fix(replays): make link copy button accessible and non-variable width#115598

Open
JoshuaKGoldberg wants to merge 1 commit into
masterfrom
replay-copy-button-spacing
Open

fix(replays): make link copy button accessible and non-variable width#115598
JoshuaKGoldberg wants to merge 1 commit into
masterfrom
replay-copy-button-spacing

Conversation

@JoshuaKGoldberg
Copy link
Copy Markdown
Member

@JoshuaKGoldberg JoshuaKGoldberg commented May 14, 2026

Fixes two issues with the replay link copy button:

  • Accessibility: adds focus-within for its hover presence so non-mouse (e.g. keyboard) users can see it
  • Width: keeps it in the page but with zero opacity, so it move the Update button when hovered

Also removes an extra <Flex> container around the flex container.

image

@JoshuaKGoldberg JoshuaKGoldberg changed the title Replay copy button spacing fix(replays): make link copy button accessible and non-variable width May 14, 2026
@github-actions github-actions Bot added the Scope: Frontend Automatically applied to PRs that change frontend components label May 14, 2026
height: 34px;
`;

const HoverArea = styled(Flex)``;
Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

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

[Question] Do we, have a better way of doing this? Note the need to ${HoverArea} a few lines later.

@github-actions
Copy link
Copy Markdown
Contributor

📊 Type Coverage Diff

✅ No new type safety issues introduced. Coverage: 93.52%

@JoshuaKGoldberg JoshuaKGoldberg marked this pull request as ready for review May 14, 2026 22:59
@JoshuaKGoldberg JoshuaKGoldberg requested a review from a team as a code owner May 14, 2026 22:59
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Scope: Frontend Automatically applied to PRs that change frontend components

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant