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

Design: the finder's footnote uses the design system, and finder-note leaves §5d #3676

Merged opened this

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

Merged

The finder's footnote now uses `muted small num` instead of `.finder-note`, and the `.finder-note` rule and its §5d bullet in `docs/DESIGN.md` are gone. I did not add the before/after screenshots of the open finder in light and dark. I couldn't produce them in this sandbox, so that checklist item is open.

shipped production is serving it deploy fb6f20c

opened this

The finder's footnote now uses muted small num instead of .finder-note, and the .finder-note rule and its §5d bullet in docs/DESIGN.md are gone. I did not add the before/after screenshots of the open finder in light and dark. I couldn't produce them in this sandbox, so that checklist item is open.

bun scripts/design-lint.ts passes and test/web-code.test.ts passes (30 tests). bun x tsc --noEmit failed in the sandbox with "bun is unable to write files to tempdir", so the type check did not run. The forge's check will run it on the push.

  • Markup: src/web/pages/explorer.ts draws the footnote as <span class="muted small num">. src/web/client.ts now finds it with .palette-foot > span, since the class it used to look up is gone.
  • Test: the "finder is offered as an enhancement" test in test/web-code.test.ts now asserts that the finder's HTML has no finder-note and has the utility-class span.
  • Look: the note goes from --faint to --muted-fg, which is slightly darker, and from 12.5px to 13px (.small). That is the only visible change, and it is why the screenshots matter.

To try it, open a code page, press t, and check the footnote at the bottom of the finder in both themes.

Closes #3624

commented

The finder's footnote now uses muted small num instead of .finder-note, and the .finder-note rule and its §5d bullet in docs/DESIGN.md are gone. I did not add the before/after screenshots of the open finder in light and dark. I couldn't produce them in this sandbox, so that checklist item is open.

bun scripts/design-lint.ts passes and test/web-code.test.ts passes (30 tests). bun x tsc --noEmit failed in the sandbox with "bun is unable to write files to tempdir", so the type check did not run. The forge's check will run it on the push.

  • Markup: src/web/pages/explorer.ts draws the footnote as <span class="muted small num">. src/web/client.ts now finds it with .palette-foot > span, since the class it used to look up is gone.
  • Test: the "finder is offered as an enhancement" test in test/web-code.test.ts now asserts that the finder's HTML has no finder-note and has the utility-class span.
  • Look: the note goes from --faint to --muted-fg, which is slightly darker, and from 12.5px to 13px (.small). That is the only visible change, and it is why the screenshots matter.

To try it, open a code page, press t, and check the footnote at the bottom of the finder in both themes.

Approved

Approved. The footnote now uses the §5 utilities (.muted .small .num), the one-off rule and its §5d bullet are gone, and the test would fail without the change. The selector in client.ts still finds the note, because it is the first span child of .palette-foot. No new dependency, nothing mutates, and it works without JS.

Two things I would do next:

  1. Pin the note with a stable hook, such as an id or data-finder-note, instead of .palette-foot > span. That selector breaks silently if someone puts a span before the note.
  2. Add the light and dark screenshots of the open finder that the checklist asks for. The note moves from --faint to --muted-fg and from 12.5px to 13px, which is a visible change.
Sign in to join this conversation.

↑↓ navigate ↵ open ⌘↵ its app esc close

Keyboard shortcuts

Docs