I3214 — The narrow-screen menu of /ui and /cockpit closes on Escape, on a choice and on its backdrop, and returns focus to its toggle
Give /ui and /cockpit one narrow-screen drawer shell (toggle, panel, backdrop) that each surface fills with its own entries: Escape, the backdrop and choosing an entry close it, focus returns to the toggle, the page behind does not scroll while it is open, it opens with scripts off, and only one menu toggle shows at a narrow width; the Cockpit gains the narrow navigation it lacks, and cockpit-probe holds the behaviour at every declared width.
READY wave 0 · p1 · implementation profile · parallel safe
Ready. Every dependency is done, so majordomus plan start I3214 will be accepted.
Objective
Give /ui and /cockpit one narrow-screen drawer shell (toggle, panel, backdrop) that each surface fills with its own entries: Escape, the backdrop and choosing an entry close it, focus returns to the toggle, the page behind does not scroll while it is open, it opens with scripts off, and only one menu toggle shows at a narrow width; the Cockpit gains the narrow navigation it lacks, and cockpit-probe holds the behaviour at every declared width.
Why
On 2026-10-08 the owner wrote that drawers do not work on mobile and that this harms adoption; the conversation names no reproduction (see open question Q1). The site's navbar collapse has a behaviour spec (nav-collapse.mjs); the UI's sidebar checkbox has none. Proposed in ADR 0215 (A phone is the baseline width of every first-party surface, and the primary flow is accepted there before a surface grows) (proposed; it carries no authority until the owner accepts it). Sources: chatgpt-majordomus:c197#0, chatgpt-majordomus:c197#1, chatgpt-majordomus:c193#9.
Current state
Verified on master 707a04c7ce8: only /ui has a narrow menu, the mj-ui-menu checkbox (apps/majordomus-cli/src/ui/shell.rs, share/ui/src/ui.css); the Cockpit's sidebar is `sticky hidden ... lg:block` (share/cockpit/src/cockpit.css), so below 1024 px its sections are reached only through the JavaScript Ctrl-K palette; scripts/lib/interaction-specs/nav-collapse.mjs holds the site navbar's collapse at one width; I1016 (the Cockpit works on a phone) is BLOCKED on I1009.
Desired state
One drawer shell rendered by ui/shell.rs and cockpit/view.rs, each passing its own entries, and scripts/lib/cockpit-probe.mjs driving it on /ui and /cockpit at every width /api/v1/design declares.
Scope
- apps/majordomus-cli/src/ui/shell.rs
- apps/majordomus-cli/src/cockpit/view.rs
- share/ui/ui.js
- share/ui/src/ui.css
- docs/MAJORDOMUS_UI.md
Out of scope
- The behaviour of the site navbar's collapse
- Any route or entry change
Dependencies
None. This issue is a root of the graph.
What waits on this
- I3216BLOCKED The IDD loop is accepted at a phone's width as it is at a desktop's
- I3217BLOCKED A wide table on a UI screen is a stacked list below the narrow width, from the same rows
Acceptance criteria
- With scripts off the drawer still opens on /ui and /cockpit and every entry is reachable
- The ui audit and the navbar comparison of I2770 stay green
Validation
- scripts/cockpit-probe --quick
- scripts/ui audit --only /ui
- cargo test --manifest-path apps/majordomus-cli/Cargo.toml --lib ui::shell
Evidence required
- cockpit_probe_drawer_every_width
Evidence
None recorded. Every token above needs a command or an artifact behind it before this issue can be completed; narrative is refused.
Timeline
- started
- —
- verified
- —
- completed
- —
Those three fields, the evidence above and the state of the dependencies are all the status is made of. There is no status field to disagree with them.
Canonical record: .ai/repo/project/issues/I3214.yaml. Read it back with majordomus plan show I3214.