fix: top 3 mobile UX issues from audit#44
Merged
Conversation
UX audit at 390px/1440px against a Linear-style bar found three mobile-breaking issues: 1. Bookmark rows showed only the title on mobile — domain and tags were hidden below md, and the invisible hover checkbox reserved space and intercepted taps. Rows now render a second line with domain + tag chips on mobile, and the checkbox only renders there in selection mode. Desktop layout is unchanged. 2. The selection action bar overflowed the viewport horizontally on phones, cutting off the count and Cancel button. It now docks as a full-width bottom bar with safe-area padding on small screens and keeps the floating pill on sm+, with compact labels so all actions fit down to 320px. 3. The top bar squeezed the search field until its placeholder truncated to "Sea". The sort select collapses to an icon trigger (native select overlay) on mobile, spacing tightens, and the search input keeps usable width. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_016huxQpLUq98cV3CJf2RCNW
✅ Deploy Preview for hypermarkk ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
UX audit at 390px/1440px against a Linear-style bar found three
mobile-breaking issues:
Bookmark rows showed only the title on mobile — domain and tags were
hidden below md, and the invisible hover checkbox reserved space and
intercepted taps. Rows now render a second line with domain + tag
chips on mobile, and the checkbox only renders there in selection
mode. Desktop layout is unchanged.
The selection action bar overflowed the viewport horizontally on
phones, cutting off the count and Cancel button. It now docks as a
full-width bottom bar with safe-area padding on small screens and
keeps the floating pill on sm+, with compact labels so all actions
fit down to 320px.
The top bar squeezed the search field until its placeholder
truncated to "Sea". The sort select collapses to an icon trigger
(native select overlay) on mobile, spacing tightens, and the search
input keeps usable width.
Co-Authored-By: Claude Fable 5 noreply@anthropic.com
Claude-Session: https://claude.ai/code/session_016huxQpLUq98cV3CJf2RCNW