Estimate: 38m
The design asset for the unified area. design/projects/ covers only Members + Access (6.4.1); the estimation/board notes designed hub CARDS against the retiring card-hub grammar — the area shell, the grouped nav, and the Details landing are undesigned (the design-gate NONE-exists case). Output: design/projects/settings-area.mock.html + PNG + a design-notes section. Render checklist + AA + dark parity. Mirror: the verified Jira project-settings sidebar shape (grouped pages, Details landing, way back to the project).
Specify, panel by panel:
- Entry + the area chrome — the app-sidebar Settings item opens the area; how the settings nav sits relative to the app shell (replaces vs. nests beside the 2.2-era sidebar — pick one and draw it), the project identity header (avatar + name + key), and the explicit way back to the project.
- The grouped nav — General (Details) / Access (Members & access) / Work (Workflow, Boards, Estimation, Fields, Components) / Automation (the 6.6 slot, drawn as a designed-for entry, not rendered until it ships); active state, hover, iconography (reuse the shipped
components/ui/Sidebar.tsx vocabulary — no hand-rolled nav rows).
- A re-housed page — one existing section (Workflow as the exemplar) inside the area chrome: the serif-title page grammar KEPT, the per-page back-crumb DROPPED (the nav owns orientation now).
- The Details landing — read-only identity rows (avatar, name, key, workspace, created) with the "editing arrives with 6.8" presentation, and the re-homed Archive danger zone (Details owns the danger zone — the mirror rule).
- Role states — the member (non-admin) view: which entries show, the read-only page presentation (the shipped 5.4/6.4 grammar, referenced not redrawn); the no-access direct-nav state (6.4.4, referenced).
- Narrow viewport — the nav at mobile width (collapse/disclosure behaviour, not clipped), and the no-active-project empty state (kept from the hub).
Acceptance criteria
- The mockup + PNG + notes exist, composed from shipped primitives (
Sidebar vocabulary, Card, the settings-page grammar) + token tiers; render checklist + AA + dark parity pass.
- Panels cover: entry + chrome + back, the grouped nav (incl. the Automation slot), a re-housed exemplar page, the Details landing + danger zone, member read-only + no-access states, narrow viewport + empty state.
design-notes.md names the nav-entry ↔ registry mapping (the 6.5.2 UI contract), the groups, the landing rule (/settings/project IS Details), and records the Features/Notifications/Apps deviations + the layout-admin extension slot.- No improvised primitive; token needs recorded.
Context refs
design/projects/access-members.mock.html + design-notes (6.4.1) — the settings-page grammar; design/estimation/design-notes.md (the hub-card section this supersedes — note the supersession)app/(authed)/settings/project/page.tsx (the retiring hub) + the four shipped detail pages; components/ui/Sidebar.tsx- The verified Jira project-settings-sidebar shape + deviations in the Story 6.5 description
- Findings #35/#54; the design-mockup render checklist