lfg2025/archy
1
0
Fork 0
Code Issues 24 Pull Requests 4 Actions Packages Projects Releases 72 Wiki Activity

fix(app): iOS HIG Phase 6 — modals, dialogs & overlays

Browse Source 
- PassphraseDialog: submit button h-10→h-11 (44px)
- ShareToNostr: close/cancel/publish buttons expanded to 44px
- ComparisonView: tab buttons min-h-[44px], gap-1→gap-2
- NostrProfileEditor: publish button min-h-[44px]
- NostrRelayManager: all action buttons expanded to 44px
- ChatHistory: conversation items min-h-[44px]

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Dorian
2026-03-04 13:12:43 +00:00
co-authored by Claude Opus 4.6
parent a0edbe7d20
commit 43fa1bac73
7 changed files with 21 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files
loop/plan.md
+4 -4
View File
@@ -54,13 +54,13 @@
## Phase 5: Glass Button System & Utility Classes
- [ ] **T17** — Update `.glass-button` and `.glass-button-sm` in `packages/app/src/styles/main.css` to enforce 44px minimum height on mobile. Add a responsive rule: on screens ≤ 768px, `.glass-button` gets `min-height: 48px` and `.glass-button-sm` gets `min-height: 44px`. This catches all uses of these classes automatically. On desktop they stay as-is.
- [x] **T17** — Update `.glass-button` and `.glass-button-sm` in `packages/app/src/styles/main.css` to enforce 44px minimum height on mobile. Add a responsive rule: on screens ≤ 768px, `.glass-button` gets `min-height: 48px` and `.glass-button-sm` gets `min-height: 44px`. This catches all uses of these classes automatically. On desktop they stay as-is.
- [ ] **T18** — Audit all `!h-7 !min-h-0` overrides. These force 28px height, defeating the glass button minimum. Search all `.vue` files for `!h-7` and `!min-h-0`. Replace with mobile-responsive approach: keep desktop size but ensure 44px minimum on mobile using `min-h-[44px] md:min-h-0`.
- [x] **T18** — Audit all `!h-7 !min-h-0` overrides. These force 28px height, defeating the glass button minimum. Search all `.vue` files for `!h-7` and `!min-h-0`. Replace with mobile-responsive approach: keep desktop size but ensure 44px minimum on mobile using `min-h-[44px] md:min-h-0`.
- [ ] **T19** — Add a `.touch-target` utility class to `main.css`: `.touch-target { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }`. Then refactor at least 15 icon buttons across the app to use this class instead of manual min-w/min-h. This creates a reusable pattern for future development.
- [x] **T19** — Add a `.touch-target` utility class to `main.css`: `.touch-target { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }`. Then refactor at least 15 icon buttons across the app to use this class instead of manual min-w/min-h. This creates a reusable pattern for future development.
- [ ] **TEST:P5** — Run `pnpm typecheck && pnpm lint && pnpm test`. Commit and push.
- [x] **TEST:P5** — Run `pnpm typecheck && pnpm lint && pnpm test`. Commit and push.
## Phase 6: Modals, Dialogs & Overlays