Use the new portrait on About and crop it to a circle - #112
Merged
Conversation
The About photo was a 960x540 landscape selfie, so it read as a snapshot rather than an author portrait. Replace it with a square studio shot (400x400, 17 KB) and render it as a circle. Markdown images take no class, so the image is now an <img> tag with a .profile-photo class. The repo had no stylesheet of its own — the theme supplied /assets/main.css — so add assets/main.scss that imports minima and appends the one rule. object-fit: cover keeps the face centred if a future photo is not square. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
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
1 participant
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.
Why
The About photo was a 960x540 landscape selfie — it read as a snapshot rather than an author portrait, which is the register the rest of the page now sits in.
What changed
scripts/optimize-images --checkpasses). Same path, so nothing else needed updating.<img class="profile-photo">tag./assets/main.css), so this imports minima unchanged and appends the one rule: 200×200,border-radius: 50%,object-fit: cover.coverkeeps the face centred if a future photo is not square.Verification
Served locally and checked
/about/at 1100px and at 375px mobile: the portrait renders as a clean circle at both, computed style is200px × 200px / 50% / cover, and the image loads at its natural 400×400.🤖 Generated with Claude Code