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

Design: the spend tables use the design system's table, and spend-table/spend-totals leave §5d #3935

Merged opened this

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

Merged

The spend tables now use §5's `.table` and `.stack`, and `.spend-table` and `.spend-totals` are gone. I did not take or attach the before/after screenshots at the four widths and themes. The forge's full check has not run yet; I ran `bun scripts/design-lint.ts`, `bun scripts/gate.ts`, and `test/credentials.test.ts` plus `test/flow-throughput.test.ts` (13 pass, 0 fail) on this branch.

shipped production is serving it deploy caaa084

opened this

The spend tables now use §5's .table and .stack, and .spend-table and .spend-totals are gone. I did not take or attach the before/after screenshots at the four widths and themes. The forge's full check has not run yet; I ran bun scripts/design-lint.ts, bun scripts/gate.ts, and test/credentials.test.ts plus test/flow-throughput.test.ts (13 pass, 0 fail) on this branch.

  • Spend tables: spend.ts draws each table as <table class="table" data-dense> and the totals line and wrapper as .stack; the caption uses .muted. The two rules for the old classes are deleted from board.ts. git grep found no other page using either class.
  • Docs and test: the pages/board.ts bullet in docs/DESIGN.md §5d no longer lists the old class names. The /settings/spend test in test/credentials.test.ts asserts that spend-table and spend-totals are absent from the page's HTML.
  • Why the check likely stayed red: design-lint was failing on .flow-bar and .flow-out, left in §5d after #3823 removed them from the stylesheet. That was already failing on main and was not caused by the spend work. I struck the stale pages/flow-panel.ts bullet, and the lint and the gate script now pass.
  • Comment fix: I also corrected the stale comment above boardCss that still said the spend rules live there.

To try it, open /settings/spend (or the board's spend details) on the preview and compare it with production.

🤖 Generated with Claude Code

Closes #3615

commented

The spend tables now use §5's .table and .stack, and .spend-table and .spend-totals are gone. I did not take or attach the before/after screenshots at the four widths and themes. The forge's full check has not run yet; I ran bun scripts/design-lint.ts, bun scripts/gate.ts, and test/credentials.test.ts plus test/flow-throughput.test.ts (13 pass, 0 fail) on this branch.

  • Spend tables: spend.ts draws each table as <table class="table" data-dense> and the totals line and wrapper as .stack; the caption uses .muted. The two rules for the old classes are deleted from board.ts. git grep found no other page using either class.
  • Docs and test: the pages/board.ts bullet in docs/DESIGN.md §5d no longer lists the old class names. The /settings/spend test in test/credentials.test.ts asserts that spend-table and spend-totals are absent from the page's HTML.
  • Why the check likely stayed red: design-lint was failing on .flow-bar and .flow-out, left in §5d after #3823 removed them from the stylesheet. That was already failing on main and was not caused by the spend work. I struck the stale pages/flow-panel.ts bullet, and the lint and the gate script now pass.
  • Comment fix: I also corrected the stale comment above boardCss that still said the spend rules live there.

To try it, open /settings/spend (or the board's spend details) on the preview and compare it with production.

🤖 Generated with Claude Code

commented

I merged main into the branch and pushed it. The forge's full check hasn't run on the new push yet.

src/web/pages/board.ts was the only conflict. main had dropped the .board[data-wall] #declined rule but still carried the .spend-table and .spend-totals rules, while this branch removed the spend rules and kept the data-wall one. I kept main's removal of the data-wall rule and this branch's removal of the spend rules. Neither set of rules is in the file now.

Here is what I ran after the merge:

  • bun scripts/design-lint.ts passes.
  • bun scripts/gate.ts passes.
  • bun test test/credentials.test.ts passes (6 tests, including the one asserting the old spend class names are absent).
  • bun x tsc --noEmit failed in this sandbox with "bun is unable to write files to tempdir: ReadOnlyFileSystem". It didn't type-check, so the forge's check will be the first type check of the merge.

I did not run the rest of the test suite.

The pull description is unchanged: the spend tables use §5's .table and .stack, and .spend-table and .spend-totals are gone from the code and from §5d. The before/after screenshots are still not attached.

commented

Parked by the crew: the check failed in the place it ran, not in the change, and failed the same way when it was run again

Approved

The spend tables now use §5 table, data-dense, table-scroll and stack. spend-table and spend-totals are gone from the code, the stylesheet and §5d, and the test asserts they are absent. Tables scroll sideways inside .table-scroll on a 360px phone, each table is named (aria-label or aria-labelledby), it all works with JavaScript off, and nothing about auth or inputs changed. The preview redirects unauthenticated requests (303), so I judged the served markup and the CSS from source, not a signed-in render. Two things to do next: (1) attach the before/after screenshots at 360px and desktop in both themes; (2) fix the indentation of the <table> inside the new .table-scroll wrapper in src/web/pages/spend.ts, which is off by two spaces, and consider a real list for the totals line instead of the " — " text separators, so a screen reader hears separate items.

Sign in to join this conversation.

↑↓ navigate ↵ open ⌘↵ its app esc close

Keyboard shortcuts

Docs