docs(fase-5.15): title chrome cleanup on detail views

Recorded in plan/fase-5-mobile-ux.md (new §5.15 right next to the
existing 5.13 / 5.14 sections) and CLAUDE.md "Fase 5 — what has been
built" with the list.status → visual signal table.

Code change landed in 73bc51e.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-04-14 03:25:28 +02:00
parent 73bc51e0ab
commit 5803806295
2 changed files with 25 additions and 0 deletions

View File

@@ -98,6 +98,11 @@ just test-e2e-headed # Playwright with visible browser (debugging)
- On `/lists/[id]`, `/tasks/[id]`, `/notes/[id]`, `/lists/[id]/session` the global `MobileTopBar` is hidden via an `isDetailRoute` regex check in `(app)/+layout.svelte`. The route's own contextual header (back + title + actions) becomes the only top chrome and is now `sticky top-0 z-30 bg-surface/80 backdrop-blur-xl`.
- `BottomTabBar` stays visible so users can hop between sections.
**5.15 detail-view title chrome cleanup**
- `/lists/[id]` and `/tasks/[id]` dropped the uppercase eyebrow label ("ACTIVE LIST" / "TASK MANAGER") that used to sit above the editable title. Title moved up into that space.
- `/lists/[id]` status signal replaces the hardcoded "ACTIVE LIST": `completed` → title with `text-text-secondary line-through`; `archived` → muted pill next to title (`data-testid="list-status-pill"`); `active` → plain title.
- `/tasks/[id]` has no status on `task_lists`; just the label drop.
**5.14 inline add-form (last element of the list)**
- `/lists/[id]` + `/tasks/[id]` no longer have a bottom-sticky add form. The form renders **inline as the last child of the unchecked / pending section** (just above Checked / Completed). Empty-state branch shows message + form beneath it.
- On `/lists/[id]` the frequency chips (`ItemSuggestions`) moved below the input (input row on top, chips on second line). Mobile: horizontal scroll; desktop: wrap.

View File

@@ -480,6 +480,26 @@ Doble tap corto (≤ 300 ms entre toques) en una fila (en modo normal) abre un o
---
#### 5.15 Título limpio en detail views (sin eyebrow) + señal de estado
**Cambio de UX:** el "eyebrow" uppercase ("ACTIVE LIST" / "TASK MANAGER") que vivía sobre el título editable en `/lists/[id]` y `/tasks/[id]` se retira. El título sube para ocupar ese espacio.
Como la eyebrow anterior mezclaba "masthead label" + "status", el estado de la lista de la compra ahora se comunica de forma más directa:
| `list.status` | Señal visual |
|---------------|--------------|
| `active` | sin chrome — solo el título |
| `completed` | título con `text-text-secondary` + `line-through` |
| `archived` | pill muted (`bg-slate-200` / slate-800 en dark) junto al título, `data-testid="list-status-pill"` |
`/tasks/[id]` no tiene concepto de estado en `task_lists`, así que ahí es simplemente el título sin eyebrow.
**Archivos tocados:** `apps/web/src/routes/(app)/lists/[id]/+page.svelte`, `apps/web/src/routes/(app)/tasks/[id]/+page.svelte`.
**Criterio de aceptación:** la detail view ya no muestra la eyebrow; una lista completada se ve con strikethrough en el título; una archivada muestra el pill muted.
---
#### 5.13 Resistencia a contextos no-seguros (HTTP LAN)
**Problema descubierto tras deploy de la preview mobile:** el usuario abrió `http://192.168.1.167:5173` en el móvil (origen no-seguro) y `handleAdd` lanzó `TypeError: crypto.randomUUID is not a function`. `crypto.randomUUID` solo está expuesto en HTTPS, localhost, 127.0.0.1 o file:// — fuera de eso queda `undefined`.