The board's money line names the Economics slider's position, linked to Settings → Economics #11146

The board's money line now names the Economics slider's position in plain words at the end of the month row: This month · cost $10.00 · revenue $12.00 · +$2.00 · spend: balanced. The spend: … text links to /settings/economics, and screen readers hear "Spend slider: balanced, open Economics settings".

Change to look at: before, the gap was the line's one link and the slider showed as a bare number (Economics slider: 62) on the second row. Now spend: <word> is the only link, in the accent colour, and the gap is plain text: warning tint for a loss, text colour otherwise. I didn't keep the gap as a second link to the same page, because the board allows one link per destination. docs/design/areas/chart.md already said the accent is for the link and never for a gap, and it now lists .money-spend. The second row now holds only today's gap.

The words come from positionWord() in src/core/slider.ts. The two ends use the Economics page's own words:

An out-of-range value or a non-number reads as the default's word. .money-spend never breaks in the middle, so on a phone the row wraps between its parts. The three rows already reserved at 480 px and under still hold it, so nothing shifts.

Tests: test/board-money-line.test.ts renders /board with no position saved (shows spend: balanced), then at 10, 0, 80 and 100. For each it checks the word, the link's href and accessible name, and that the line has exactly one link. It also checks the band edges (39/40/60/61) and the fallbacks. I updated the assertions in test/money.test.ts and a comment in test/themes.test.ts; they described the old gap link, not a mistake in the tests. docs/features/money.md is updated too.

Checks: bun scripts/gate.ts, bun x tsc --noEmit and bun scripts/design-lint.ts are clean, and the three money and theme test files pass (27 tests).

Not done:

• I didn't take light and dark screenshots at 390 px; check them on the preview.
• The terminal app's money screen is unchanged.
• The keep_plan tool wasn't available in this run, so the issue has no plan posted.

Try it: open /board as a forge admin and press spend: … to land on Settings → Economics. Move the slider there and the word on the board changes.

🤖 Generated with Claude Code

Closes #11102

The board's money line now names the Economics slider's position in plain words at the end of the month row: This month · cost $10.00 · revenue $12.00 · +$2.00 · spend: balanced. The spend: … text links to /settings/economics, and screen readers hear "Spend slider: balanced, open Economics settings".

Change to look at: before, the gap was the line's one link and the slider showed as a bare number (Economics slider: 62) on the second row. Now spend: <word> is the only link, in the accent colour, and the gap is plain text: warning tint for a loss, text colour otherwise. I didn't keep the gap as a second link to the same page, because the board allows one link per destination. docs/design/areas/chart.md already said the accent is for the link and never for a gap, and it now lists .money-spend. The second row now holds only today's gap.

The words come from positionWord() in src/core/slider.ts. The two ends use the Economics page's own words:

An out-of-range value or a non-number reads as the default's word. .money-spend never breaks in the middle, so on a phone the row wraps between its parts. The three rows already reserved at 480 px and under still hold it, so nothing shifts.

Tests: test/board-money-line.test.ts renders /board with no position saved (shows spend: balanced), then at 10, 0, 80 and 100. For each it checks the word, the link's href and accessible name, and that the line has exactly one link. It also checks the band edges (39/40/60/61) and the fallbacks. I updated the assertions in test/money.test.ts and a comment in test/themes.test.ts; they described the old gap link, not a mistake in the tests. docs/features/money.md is updated too.

Checks: bun scripts/gate.ts, bun x tsc --noEmit and bun scripts/design-lint.ts are clean, and the three money and theme test files pass (27 tests).

Not done:

• I didn't take light and dark screenshots at 390 px; check them on the preview.
• The terminal app's money screen is unchanged.
• The keep_plan tool wasn't available in this run, so the issue has no plan posted.

Try it: open /board as a forge admin and press spend: … to land on Settings → Economics. Move the slider there and the word on the board changes.

🤖 Generated with Claude Code

The board's money line now ends with the Economics slider's position in plain words, and the terminal's money screen shows the same word instead of a bare number. On the board, spend: <word> is the line's one link to /settings/economics; screen readers hear "Spend slider: balanced, open Economics settings".

Board: the month row reads This month · cost $10.00 · revenue $12.00 · +$2.00 · spend: balanced, and the second row now holds only today's gap. The link moved from the gap to the slider word, so there is still only one link to Settings → Economics. The word is in the accent colour. The gap is plain text: warning tint for a loss, text colour otherwise, which is what docs/design/areas/chart.md already asks for. .money-spend never breaks in the middle, so on a phone the row wraps between its parts. The three rows already reserved at 480 px and under still hold it, so nothing shifts.

Words come from positionWord() in src/core/slider.ts. The two ends use the Economics page's own words; an out-of-range value or a non-number reads as the default's word.

Terminal: src/tui/screens/money.ts keeps its "Economics slider" row title and shows the word as the value. It can't link, so it has no spend: prefix.

Tests:

• test/board-money-line.test.ts renders /board with no position saved (shows spend: balanced), then at 10, 0, 80 and 100. For each it checks the word, the link's href and accessible name, and that the line has exactly one link. It also checks the band edges and the fallbacks.
• test/tui-money.test.ts checks the terminal row at 0, 20, 50, 80 and 100.
• In test/money.test.ts and test/tui-money.test.ts I updated the old assertions that expected the gap link or the number 62. Those tests weren't wrong; they described the old behaviour. test/themes.test.ts only had a comment updated.

Screenshots: I can't take browser screenshots from this sandbox. Instead, forge.json now lists /board under looksAsOwner, so the preview takes the board's looks signed in as the owner. A visitor never sees the money line, so the existing /board look couldn't show it. Check the line at 390 px, light and dark, in the preview's looks.

Tidying: the long comment lines in the header of money_line.ts and in the content.ts comment are rewrapped.

Checks: bun scripts/gate.ts, bun x tsc --noEmit and bun scripts/design-lint.ts are clean. The money tests (board, page and terminal) and the looks tests pass.

Try it: open /board as a forge admin, press spend: …, move the slider, and the board's word changes. In the terminal, open the palette, choose Money, and the slider row shows the same word.

🤖 Generated with Claude Code