Pipeline redesign: the side rail shell

tiagoagueda commented

2026-11-01 14:17:38 +00:00

Owner

Part of #1191. Design: the redesign canvas, https://claude.ai/artifact/CTfX5t4BQiVq9cH97XFvcZ (private to the maintainer until shared). Each screen has three artboards: today, polished and bold; this milestone builds bold. (every Bold desktop artboard shows the rail.)

Replace the masthead in base.html and partials/nav_links.html with the dark rail.

What

Top of the rail: the wordmark, then the Jump to anything button (see the command bar issue) and a full-width primary New menu.
Groups: Work (Today, Listings, Applications, Calendar) and Library (Documents, Companies). The person's own order and hidden items (#299) are kept within the groups.
Foot: Settings, Help, and the account (avatar and name), which opens today's account menu.
Current page: marked with aria-current="page". The rail is a <nav aria-label="Main">, first in reading order after the skip link.
Right-to-left: logical properties throughout, so the rail sits on the right.
Narrow desktop and tablet: the rail collapses to icons with tooltips. Below md it becomes the phone bar (see the phone bar issue).
Counts beside items: per the maintainer's decision. If kept, they are cached per person and invalidated on change, never one query per item per request.
Plugins: pages render inside the new shell unchanged. Plugin navigation entries, if any, go in the right group.

Acceptance

The 12 browser-test files that name the navigation are migrated.
The keyboard order and screen-reader names are unchanged in meaning.
No horizontal page scroll at any width.
The extra queries per page are measured and stated in the PR.

Depends on #1193, #1194, #1196.

🤖 Generated with Claude Code

Part of #1191. Design: the redesign canvas, https://claude.ai/artifact/CTfX5t4BQiVq9cH97XFvcZ (private to the maintainer until shared). Each screen has three artboards: *today*, *polished* and *bold*; this milestone builds **bold**. (every Bold desktop artboard shows the rail.) Replace the masthead in `base.html` and `partials/nav_links.html` with the dark rail. ## What - **Top of the rail:** the wordmark, then the *Jump to anything* button (see the command bar issue) and a full-width primary **New** menu. - **Groups:** *Work* (Today, Listings, Applications, Calendar) and *Library* (Documents, Companies). The person's own order and hidden items (#299) are kept within the groups. - **Foot:** Settings, Help, and the account (avatar and name), which opens today's account menu. - **Current page:** marked with `aria-current="page"`. The rail is a `<nav aria-label="Main">`, first in reading order after the skip link. - **Right-to-left:** logical properties throughout, so the rail sits on the right. - **Narrow desktop and tablet:** the rail collapses to icons with tooltips. Below `md` it becomes the phone bar (see the phone bar issue). - **Counts beside items:** per the maintainer's decision. If kept, they are cached per person and invalidated on change, never one query per item per request. - **Plugins:** pages render inside the new shell unchanged. Plugin navigation entries, if any, go in the right group. ## Acceptance - The 12 browser-test files that name the navigation are migrated. - The keyboard order and screen-reader names are unchanged in meaning. - No horizontal page scroll at any width. - The extra queries per page are measured and stated in the PR. Depends on #1193, #1194, #1196. 🤖 Generated with [Claude Code](https://claude.com/claude-code)

tiagoagueda added this to the 0.7.0 milestone

2026-11-01 14:17:38 +00:00

tiagoagueda added the

accessibility

interface

labels

2026-11-01 14:17:38 +00:00

tiagoagueda referenced this issue

2026-11-01 14:17:39 +00:00

Pipeline redesign: the phone bar with a central New #1198

tiagoagueda referenced this issue

2026-11-01 14:17:39 +00:00