Skip to content

Center the glyph in the tile, and align the README mark - #50

Merged
ipjohnson merged 3 commits into
mainfrom
fix/readme-logo-alignment
Aug 28, 2026
Merged

Center the glyph in the tile, and align the README mark#50
ipjohnson merged 3 commits into
mainfrom
fix/readme-logo-alignment

Conversation

@ipjohnson

Copy link
Copy Markdown
Owner

Follow-up to #49 — this commit was pushed to that branch just after the merge, so it
rides again here. Two defects, found by rendering the README through GitHub's own
markdown API with GitHub's CSS and looking at the result:

  • The tile's glyph sat 6 units low — a translate value took a margin's number,
    ignoring the glyph's own y-offset. assets/icon.png is regenerated truly centered
    (corrects the NuGet icon too, visible with the next release), and assets/icon.svg
    is checked in beside it as the source of truth with the arithmetic written down.
  • The h1 mark now aligns with the title's visual center. GitHub strips CSS, so the
    only lever is the legacy align="middle" attribute, which anchors a few pixels below
    the visual center — the header now uses assets/logo-readme.svg, a cut whose glyph
    sits 6 units above true center to compensate, verified pixel-level against GitHub's
    renderer. Its off-centering is deliberate; the comment in the file says so.

The header image URL points at main, so the alignment shows on GitHub once this
merges.

Not merging — that's yours.

🤖 Generated with Claude Code

https://claude.ai/code/session_011ysVAfsbKMfGBaAkWvuRTf

ipjohnsonand others added 3 commits August 28, 2026 19:32
Two defects, found by rendering the README through GitHub's own
markdown API with GitHub's CSS and looking:
The tile's glyph sat 6 units low — the transform took 18 as a
translate value where it was meant as a margin, ignoring the glyph's
own y-offset of 8. icon.png is regenerated centered, and icon.svg now
lives beside it as the source of truth with the arithmetic written
down.
The README h1 can only be aligned with the legacy align attribute —
GitHub strips CSS — and align="middle" anchors a few pixels below the
title's visual center. The header now uses assets/logo-readme.svg, a
cut whose glyph sits 6 units above true center to compensate, verified
pixel-level against GitHub's renderer. The NuGet icon stays truly
centered; only the README cut carries the compensation.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_011ysVAfsbKMfGBaAkWvuRTf
The absolute raw URL pointed at main, where logo-readme.svg does not
exist until this merges — so branch views rendered nothing. A relative
path resolves against whichever ref is being viewed: this branch now,
main after the merge, and forks. Nothing is lost on nuget.org, which
strips HTML img tags either way; the package pages carry the mark
through PackageIcon.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_011ysVAfsbKMfGBaAkWvuRTf
Measured on the live branch page: GitHub renders align="middle" via
Chrome's -webkit-baseline-middle mapping, anchoring the image box
center 12-16px below the title's visual center — the harness CSS had
understated the offset. No attribute value lands on the right anchor,
so the compensation moves into the canvas: the glyph is pinned to the
top of a taller transparent box (width 64, glyph 35px), putting its
visible center exactly on the title's center. Verified in a local
render using GitHub's markdown API and CSS.
The cut also splits into light and dark variants behind GitHub's
theme-aware <picture> support — the bare mark replaces the white tile,
so dark mode gets the lifted colorway instead of a glaring chip. New
file names double as a cache-bust for raw/camo.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_011ysVAfsbKMfGBaAkWvuRTf
@ipjohnson
ipjohnson merged commit adeb517 into mainAug 28, 2026
2 checks passed
@ipjohnsonipjohnson mentioned this pull request Aug 29, 2026
ipjohnson added a commit that referenced this pull request Aug 29, 2026
Version and changelog only. The icon fix and README header landed in
#48-#50; this is the release that puts the corrected icon on nuget.org,
since a package icon is per published version.
Claude-Session: https://claude.ai/code/session_011ysVAfsbKMfGBaAkWvuRTf
Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
Sign up for freeto 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

@ipjohnson