Skip to content

fix(attachments): show the remove button on keyboard focus and touch - #508

Open
HardMax71 wants to merge 1 commit into
vercel:mainfrom
HardMax71:fix/attachments-remove-button-focus
Open

HardMax71 wants to merge 1 commit into
vercel:mainfrom
HardMax71:fix/attachments-remove-button-focus

Conversation

@HardMax71

Copy link
Copy Markdown

Adds focus-visible:opacity-100 and pointer-coarse:opacity-100 next to group-hover:opacity-100 on the remove button in the grid and inline variants. With a mouse nothing changes. I also updated the AttachmentRemove docs and added a changeset.

The elements test setup does not load Tailwind CSS, so the new __tests__/attachments.test.tsx only checks that both classes are on the button in both variants; it fails on main and passes here. I checked that Tailwind 4.1.18 compiles pointer-coarse:opacity-100 to a rule inside @media (pointer: coarse) and group-hover:opacity-100 to one inside @media (hover: hover). The full @repo/elements suite passes (960 tests).

I kept QueueItemAction, which has the same pattern, out of this PR.

Closes #507

In the grid and inline variants the remove button was opacity-0 until
group-hover. Tab focus landed on a button that stayed invisible, and
Tailwind v4 wraps hover variants in @media (hover: hover), so on touch
screens the button never appeared. It now also shows on focus-visible
and on coarse pointers.
@vercel

vercel Bot commented Oct 2, 2026

Copy link
Copy Markdown
Contributor

@HardMax71 is attempting to deploy a commit to the Vercel Team on Vercel.

A member of the Team first needs to authorize it.

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Attachments: remove button stays invisible on keyboard focus and on touch screens

1 participant