Responsive polish on non-editor pages (gardens list, plants, settings, modals) #105

Closed
opened 2026-07-22 04:38:05 +00:00 by steve · 0 comments
Owner

Part of #96.

Problem. Beyond the editor, the other screens are desktop-shaped:

  • Gardens list card actions (Share / Copy / Edit / Delete) are small text links in a row, not touch buttons; on a phone they're easy to mis-tap (see epic screenshot).
  • Plants catalog grid + seed-lot expansion, Settings, and the various form/confirm modals were laid out desktop-first.
  • Confirm modals (Delete/Leave/Copy/ClearBed) repeat the same shape — a good chance to land a shared ConfirmModal primitive while here (also listed in the cleanup issue; do it in whichever lands first and reference it).

Do.

  • Make gardens-list and plants-list cards thumb-friendly: primary tap = open; secondary actions as an overflow/menu or clearly-sized buttons, not a cramped link row.
  • Verify Settings, PlantForm/SeedLot/Share/GardenForm modals all read and operate well at 390px (bottom-sheet where appropriate — the Modal primitive already supports it).
  • Confirm the journal date filter and category chips are comfortable on touch.

Acceptance.

  • Every non-editor screen is usable one-handed at 390px with no overflow, no wrapped/cramped action rows, and ≥44px primary targets.
  • Desktop unaffected.

Pure frontend polish; keep it to the non-editor surfaces so it doesn't collide with the editor PRs.

Part of #96. **Problem.** Beyond the editor, the other screens are desktop-shaped: - **Gardens list** card actions (Share / Copy / Edit / Delete) are small text links in a row, not touch buttons; on a phone they're easy to mis-tap (see epic screenshot). - **Plants catalog** grid + seed-lot expansion, **Settings**, and the various form/confirm modals were laid out desktop-first. - Confirm modals (`Delete/Leave/Copy/ClearBed`) repeat the same shape — a good chance to land a shared `ConfirmModal` primitive while here (also listed in the cleanup issue; do it in whichever lands first and reference it). **Do.** - Make gardens-list and plants-list cards thumb-friendly: primary tap = open; secondary actions as an overflow/menu or clearly-sized buttons, not a cramped link row. - Verify Settings, PlantForm/SeedLot/Share/GardenForm modals all read and operate well at 390px (bottom-sheet where appropriate — the `Modal` primitive already supports it). - Confirm the journal date filter and category chips are comfortable on touch. **Acceptance.** - Every non-editor screen is usable one-handed at 390px with no overflow, no wrapped/cramped action rows, and ≥44px primary targets. - Desktop unaffected. Pure frontend polish; keep it to the non-editor surfaces so it doesn't collide with the editor PRs.
steve added the frontendpolish labels 2026-07-22 04:38:05 +00:00
steve closed this issue 2026-07-22 13:51:54 +00:00
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: steve/pansy#105