Repository navigation
Copy buttons for commands are missed on mobile #1771
Description
Describe the bug
On Package page each command has a "Copy" button next to it. It is visible on hover state for the desktop version. But it is missed on mobile devices since there is no hover state.
Steps to reproduce:
- Use mobile device or emulator in your browser
- Go to https://npmx.dev/package/nuxt#get-started
- In section "GET STARTED" check no button is visible to copy commands
- Still copied if you click on command, but it's not intuitive
Additional context
Activity
[-]Copy buttons for commands is missed on mobile[/-][+]Copy buttons for commands are missed on mobile[/+]ackzell commentedon Mar 2, 2026
Hi @alex-key,
What is the expected behavior that is an acceptable fix for this?
While attempting to reproduce I noticed is that I can "tap" on the command on my mobile and I do get the copy button to appear. From there, I do get the command on the clipboard if I tap on the
copybutton.Is the idea to always show the button for mobile?
alex-key commentedon Mar 2, 2026
From my point on touchscreen device it should be always visible.
cc: @alexdln
alexdln commentedon Mar 2, 2026
Another problem is that we don't have much space on mobile. But perhaps we could implement our standard behavior here as well: icon + text on desktop, and just the icon on mobile (and always show it)
RevanthPrk commentedon Mar 8, 2026
I have fixed this issue.
On mobile devices (xs, sm, md screen sizes), it will now be displayed in this way.
In Desktop and laptop screens, it will remain as is
If this looks fine, then I will raise a PR @alex-key
alex-key commentedon Mar 8, 2026
I think it's ok. Icon looks a but big to me, but let's keep it as it should be compatible with a11y requirements.
If there are any better options - we'll see during review
RevanthPrk commentedon Mar 9, 2026
Sure, I will raise a PR now
fix: show copy buttons on touch devices (npmx-dev#1771)
fix: show copy buttons on touch devices (npmx-dev#1771)
2 remaining items