Three cards overflowed the 340×200 frame for realistic profile data:
- contributions-heatmap: the classic case — 53 weeks at 9px cellSize + 2px
gap pushed the grid out to x≈611. Shrink to cellSize=5, cellGap=1 so
leftPad(22) + 53*6 = 340 (exact fit). Drop month labels within 20 px of
the right edge so "Dec"/"Apr" can't stick past the frame.
- streak: the third column rendered "N / M" at font-size 28, centered at
x=282. For 4+ digit totals (e.g. 584 / 3031) the text extended to x≈347.
Refactor to show the active-days integer by itself in the big slot and
push "of N total (P%)" into the small detail line that the other two
columns already use.
- top-starred-repos: the per-row star icon sat at x=306 while the right-
anchored number ended at x=334, so 5+ digit star counts collided with
the icon. Drop the icon (card title already says "Top Starred Repos"),
emit the count as "N ★", right-anchor at x=334 with a 6 px safety gap.
Add a new TestCardsFitFrame stress test that renders every card against an
adversarial profile (10-digit counts, 40-char names, 20 active years,
53-week span) and asserts every positional attribute stays inside the
frame. This is the automated half of the new "fit-the-frame invariant"
added to docs/design-guidelines.md + a pre-release review checklist in
docs/code-standards.md.
Bug reports will still surface text-overflow cases that the coordinate
check can't see (a text-anchor="middle" element has a single x attribute
but renders outward), so the docs also spell out the human-review step:
render dracula against tiny/typical/adversarial fixtures before release.
tiennm99