docs: close the gap the tagline left in the banner and social preview - #59
Merged
Merged
Conversation
Removing the tagline left both images laid out for content that was no longer there. On the banner the lockup ended at x=317 and the check-run panel began at x=760: a 443px void across the middle of a 1280px canvas, against outer margins of 72 and 80. The gap read as six times the margin, which is what made it look unbalanced rather than airy. The canvas is now 1000×320 and the composition is sized to what is in it: 80 margin, 274 lockup, 126 gap, 440 panel, 80 margin. The lockup grows 0.85 -> 0.95 so it carries the left side on its own now that nothing sits beside it. The panel keeps its internal layout untouched -- its text is positioned absolutely -- and moves as a group. PNGs are 2000×640, still 2×. The social preview had the same problem in the other direction: with its two tagline lines gone, a 403px lockup sat alone on a 1280px canvas. It now mirrors the banner -- lockup and domain on the left, the check run on the right -- so the card shows what the project does instead of only what it is called. The panel is recoloured for the card's darker ground rather than reused from either banner. An intermediate version scaled the lone lockup to 1.7 instead. It crowded the top edge, and the wordmark's background-coloured keyline read as a heavy outline where it crosses the check. Rendered and rejected rather than reasoned about. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_018xYa7m3qup5wyN5MaXFgf6
|
Warning Review limit reachedNext included review available in 26 minutes. View limit detailsLimit details: You’ve used the included review currently available. You've used all free OSS reviews for now. Wait for the free limit to reset to keep reviewing this public repository. Review configuration: ⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Team Run ID: ⛔ Files ignored due to path filters (6)
📒 Files selected for processing (1)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Commit Check✅ All 3 checks passed Show all 3 checkscommit-check 2.15.0 · Rules reference |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Taking the tagline out of the images in #57 left both of them laid out for content that is no longer there. I said in that PR that the banner's remaining gap would "read as margin". It does not — it reads as a hole, and the numbers say why.
The banner
The lockup ended at
x=317; the check-run panel began atx=760. A 443px void across the middle of a 1280px canvas, against outer margins of 72 and 80 — the gap is six times the margin. That ratio, not the emptiness itself, is what makes it look wrong.The canvas is now 1000×320, sized to what is actually in it:
The lockup grows because it now carries the left side alone. The panel keeps its internal layout completely untouched — its text is positioned in absolute coordinates, so it moves as a group rather than being re-laid-out. PNGs are 2000×640, still 2×.
The social preview
Same problem, other direction: with its two tagline lines gone, a 403px lockup sat alone on a 1280px canvas, about a third of the width.
It now mirrors the banner — lockup and domain pill on the left, the check run on the right — so the card shows what the project does, not just what it is called. The panel is recoloured for the card's darker ground rather than reused from either banner.
An intermediate version instead scaled the lone lockup up to 1.7. It crowded the top edge, and the wordmark's background-coloured keyline read as a heavy dark outline where it crosses the check. Rendered, looked at, rejected — not reasoned about.
Verification
Rendered with
rsvg-convertand inspected at full size, both banners and the card.branding/README.mdrecords the new dimensions, the corrected render commands, and a note that the layout is sized to its content — so the next person does not drop something back into the middle and wonder why it no longer fits.After merging
The social preview still does not update itself. Each repository needs the new file uploaded under Settings → Social preview.
🤖 Generated with Claude Code
https://claude.ai/code/session_018xYa7m3qup5wyN5MaXFgf6
Generated by Claude Code