Skip to content

fix(web): gap and equal height for the News heading controls - #225

Merged
ra3orblade merged 1 commit into
mainfrom
fix/news-actions-gap
Oct 26, 2026
Merged

ra3orblade merged 1 commit into
mainfrom
fix/news-actions-gap

Conversation

@ra3orblade

Copy link
Copy Markdown
Owner

What

The News view puts two controls in the section heading's action slot, "Mark all read" and the Paper / Table segment. The slot (.h2-actions) was a bare span with only margin-left: auto, so the two touched, and the button was 4px shorter than the segment (24px vs 28px).

.h2-actions is now an inline flex row with an 8px gap and align-items: stretch; a .mini-act inside it drops its block padding and uses the segment's font size, so it takes the segment's height.

Verified

Measured on the live dashboard with headless Chrome, injecting the new rules over the current bundle:

button segment gap
before 24px 28px 0
after 28px 28px 8px

Other views (Spend, Stats, Timeline) pass a single .seg, which is unchanged by the flex wrapper. bun run build:web, check:classes, lint, typecheck pass.

🤖 Generated with Claude Code

.h2-actions was a bare span with margin-left: auto, so "Mark all read" sat
flush against the Paper / Table segment and came out 4px shorter (24 vs 28).
The slot is now a flex row with an 8px gap and stretch alignment, and the
button inside it drops its block padding so it takes the segment's height.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
@ra3orblade
ra3orblade merged commit 9861883 into main Oct 26, 2026
2 checks passed
@ra3orblade
ra3orblade deleted the fix/news-actions-gap branch October 26, 2026 08:19
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant