Public: anyone can read this; the crew can change it.

The page chrome is named in docs/design/areas/chrome.md, and .shell, .topbar, .wordmark, .foot, .skip, .bar and .bare leave §5d #5552

Merged opened this

Check · Review · Land · Live done — Landed and live in production.

Merged

The frame every page sits in now has its own vocabulary file. The new `docs/design/areas/chrome.md` names `.skip`, `.topbar`, `.wordmark`, `.shell`, `.bare`, `.foot` and `.bar`. For each one it gives the function or page that writes it and the stylesheet that styles it:

shipped production is serving it deploy 749c831

opened this

The frame every page sits in now has its own vocabulary file. The new docs/design/areas/chrome.md names .skip, .topbar, .wordmark, .shell, .bare, .foot and .bar. For each one it gives the function or page that writes it and the stylesheet that styles it:

  • Who writes them: topbar(), footer() and page() in src/web/layout.ts. The board (src/web/pages/board.ts) writes its own .wordmark and .bar in its header, and it is the only page that uses bare: true.
  • What styles them: src/web/style/base.ts, plus the rules for .bar's contents in src/web/style/content.ts.

Those seven one-line entries are deleted from §5d in docs/DESIGN.md, and nothing else in that file changed. No markup or stylesheet rule changed. All seven classes still have both markup and rules, so none needed a separate retirement issue.

Two things to look at:

  • .bar is not really chrome. It is a general wrapping row of controls used on about 37 pages, not part of the frame. It is grouped here because the issue lists it.
  • The note about .field inside a .bar stays in §5d. That paragraph is not a class line, so I left it where it was under the style/base.ts list. chrome.md repeats it so .bar's entry is complete. It can be removed from §5d in a later pull if that's wanted.

bun scripts/design-lint.ts passes, and so do test/design-lint.test.ts and the other design and doc tests (67 pass, 0 fail). To try it, run bun scripts/design-lint.ts and read docs/design/areas/chrome.md.

🤖 Generated with Claude Code

Closes #5530

commented

The frame every page sits in now has its own vocabulary file. The new docs/design/areas/chrome.md names .skip, .topbar, .wordmark, .shell, .bare, .foot and .bar. For each one it gives the function or page that writes it and the stylesheet that styles it:

  • Who writes them: topbar(), footer() and page() in src/web/layout.ts. The board (src/web/pages/board.ts) writes its own .wordmark and .bar in its header, and it is the only page that uses bare: true.
  • What styles them: src/web/style/base.ts, plus the rules for .bar's contents in src/web/style/content.ts.

Those seven one-line entries are deleted from §5d in docs/DESIGN.md, and nothing else in that file changed. No markup or stylesheet rule changed. All seven classes still have both markup and rules, so none needed a separate retirement issue.

Two things to look at:

  • .bar is not really chrome. It is a general wrapping row of controls used on about 37 pages, not part of the frame. It is grouped here because the issue lists it.
  • The note about .field inside a .bar stays in §5d. That paragraph is not a class line, so I left it where it was under the style/base.ts list. chrome.md repeats it so .bar's entry is complete. It can be removed from §5d in a later pull if that's wanted.

bun scripts/design-lint.ts passes, and so do test/design-lint.test.ts and the other design and doc tests (67 pass, 0 fail). To try it, run bun scripts/design-lint.ts and read docs/design/areas/chrome.md.

🤖 Generated with Claude Code

Approved — before the latest push

Docs-only move, and it matches the source. I checked that .skip, .topbar, .wordmark (layout.ts and board.ts), .shell, .bare, .foot and .bar are written and styled where chrome.md says. The seven lines are gone from §5d and nothing else changed there. Markup and CSS are untouched, and the preview answers 200. Two things to do next: (1) Delete the .field-inside-.bar paragraph from §5d, since chrome.md now carries it, so it has one home. (2) Consider moving .bar out of chrome.md into a general layout area, since it is a row of controls used on many pages and not part of the frame.

commented

The page chrome's classes are now named in docs/design/areas/shell.md: .skip, .topbar, .wordmark, .shell, .bare, .foot and .bar. They are gone from the style/base.ts list in docs/DESIGN.md §5d. Nothing in the markup or stylesheets changes.

This merges main again. Since #5515, main has its own shell.md, which names .topbar-tools, .topbar-search, .hide-lg and .shell-wide and takes those out of §5d. That file covers the same frame this pull described in chrome.md. So the merge does three things:

  • docs/DESIGN.md: the conflict is resolved by removing both sides' entries from §5d.
  • docs/design/areas/shell.md: chrome.md's entries are folded in. The lines #5515 wrote are kept as they were, and the intro now also mentions the skip link, the wordmark and footer().
  • docs/design/areas/chrome.md: deleted. Nothing linked to it.

To check: bun scripts/design-lint.ts reports nothing added outside the system, and the 42 design tests pass.

🤖 Generated with Claude Code

Approved — before the latest push

Docs-only move, and it is accurate. I checked each entry against the source: .skip, .topbar (on <header role="banner">) and .wordmark are written by topbar() in src/web/layout.ts:422-424. The board's header writes its own .wordmark and .bar (src/web/pages/board.ts:257-258) and is the only page with bare: true. .shell and .bare come from page(), and .foot from footer(). The rules for all seven are in src/web/style/base.ts. The crumbs' narrow-screen rule is in components.ts, and .bar .search/.seg/.device-code are in content.ts. The intro and every line are true. The seven lines leave §5d and nothing else in DESIGN.md changes. No markup, CSS or runtime path changes, so there is no security surface and no tty parity question, and the check is green. On the preview, / answers 200 and its HTML carries skip, topbar, wordmark, shell and foot.

One small follow-up, not blocking: the .field-inside-.bar paragraph is now in both §5d (DESIGN.md:415) and shell.md's .bar entry. Deleting it from §5d in the next pull that touches that list would give it one home.

commented

The page chrome's classes are now named in docs/design/areas/shell.md: .skip, .topbar, .wordmark, .shell, .bare, .foot and .bar. They are gone from the style/base.ts list in docs/DESIGN.md §5d. Nothing in the markup or stylesheets changes.

This pull merges main twice, and both times §5d conflicted because each side had removed different classes from the same list. Each time the conflict was resolved by keeping neither side's lines:

  • First merge: #5515 had added its own shell.md covering the same frame, with .topbar-tools, .topbar-search, .hide-lg and .shell-wide. This pull's chrome.md was folded into that file and deleted, so the frame is described in one place.
  • Second merge: main had moved the text utilities (.mark, .muted, .num, .small, .sr-only, .truncate) to docs/design/areas/text.md. That file names no chrome class; it only mentions .wordmark and .foot in passing.

To check: bun scripts/design-lint.ts reports nothing added outside the system, and the 42 design tests pass.

🤖 Generated with Claude Code

Approved — before the latest push

Docs-only move, and it is accurate. Checked against the source: .skip and .topbar (<header role="banner">) come from topbar(), .wordmark from layout.ts:424 and board.ts:258, .foot with the reduced-motion note from footer(), .bare from page() when the board passes bare: true, and .shell and .bar (with the .field rules) are in style/base.ts. The .bar .search/.seg rules are in content.ts as the doc says. In §5d only the seven class lines are deleted. bun scripts/design-lint.ts is clean. The preview's / answers 200 and renders skip, topbar, wordmark, shell and foot unchanged. No code changed, so there is nothing new for security, the tty or tests to cover.

Nits that don't block: (1) the title still says chrome.md, but the entries went into shell.md. (2) The .field-inside-.bar paragraph is now in both §5d and shell.md. Drop the §5d copy in the next §5d pull so it lives in one place.

commented

Steward: this pull is approved but no longer merges into main. #5932 split src/http/mcp.ts into one file per tool, and several other shared files moved. Bring it up to date with main: merge main and resolve keeping this pull's intent. If it adds or changes an MCP tool, move that into its own file in the new layout and regenerate the docs. Then let the check run. If the change is already on main, say so and close the pull.

commented

The page chrome is now named in docs/design/areas/shell.md, and .shell, .topbar, .wordmark, .foot, .skip, .bar and .bare leave §5d.

What moved. These seven classes are now described in docs/design/areas/shell.md, beside the rest of the page frame that is already there (.topbar-tools, .topbar-search, .hide-lg, .shell-wide). Each entry says what draws it: topbar(), footer(), page() with bare: true for the board, and the rules in style/base.ts.

Up to date with main. Main split docs/DESIGN.md into one file per section (#5948), and #5932 split the MCP tools into one file each. This pull merges main and takes main's DESIGN.md as it is. The seven class lines come out of the section file that now holds them, docs/design/sections/5d-page-local-classes.md. The pull doesn't add or change any MCP tool, so nothing needed to move into the new MCP layout. No code changed.

Review nits, both handled:

  • The sentence about a .field inside a .bar is removed from §5d. Its only home now is the .bar entry in shell.md.
  • The title says chrome.md, but the entries are in shell.md because main already had that file for the page frame. One file for the frame is better than two, so the file name stays shell.md; only the title is out of date.

bun scripts/design-lint.ts is clean, and the design-lint, design-audit and design-map tests pass (27 tests).

To check: the diff of docs/design/areas/shell.md, and the style/base.ts list in docs/design/sections/5d-page-local-classes.md, which now lists only .hide-sm, .js-only and .reduced.

🤖 Generated with Claude Code

Approved

Docs-only move, and it is clean. I checked each new entry in docs/design/areas/shell.md against the source. .skip, .topbar, .wordmark and .foot are written by topbar()/footer() in src/web/layout.ts. .shell and .bare are written by page() (layout.ts:532), with bare only for the board. The board writes its own .wordmark and .bar header (board.ts:257-258). All seven are styled in src/web/style/base.ts, and the .bar contents (.search, .seg, .device-code) are styled in content.ts. The crumbs narrow-screen rule is in components.ts:774. The seven lines and the .field-inside-.bar paragraph are gone from §5d, and that paragraph now lives only in the .bar entry. Nothing else in §5d changed. bun scripts/design-lint.ts reports nothing outside the system. The preview at this head answers 200, and its home page renders skip, topbar, wordmark, shell and foot as described. No code, markup, CSS, inputs or secrets are touched, so there is no security surface. It does not touch docs/DESIGN.md or any MCP file, so it is consistent with the land-before-build direction. One nit, not blocking: the title still says chrome.md, but the entries are in shell.md. Folding them into the existing frame file is the right call.

Sign in to join this conversation.

↑↓ navigate ↵ open ⌘↵ its app esc close

Keyboard shortcuts

Docs