feat(seo): og-image with real wordmark + single-clone rule#35
Merged
Conversation
Replace the Pillow-rendered og-image (which spelled the brand "Cercol" without the accent and used a plain typeface) with one built from the canonical wordmark SVG that the website header ships. Output is a 1200x630 PNG with brand-blue background (#0047ba) and white wordmark centred, no claim text. - src/assets/brand/cercol-wordmark.svg: canonical SVG copy of the wordmark paths from src/components/CercolLogo.jsx. The React component stays the source of truth at runtime; this file is the copy used by the asset pipeline so the OG image cannot drift away from the brand. - scripts/generate_og_image.mjs: composes a 1200x630 SVG (blue rect plus nested wordmark with currentColor=#ffffff) and rasters it with @resvg/resvg-js. Reproducible: `node scripts/generate_og_image.mjs`. - scripts/generate_og_image.py: removed. The Pillow output is replaced by the resvg one; no other caller referenced it. - @resvg/resvg-js added as a devDependency. - public/og-image.png regenerated. New size 15 KB (was 25 KB). Pixel sampling confirms the layout: corner (10, 10) -> rgb(0, 71, 186) blue corner (1190, 620) -> rgb(0, 71, 186) blue center (600, 315) -> rgb(0, 71, 186) blue (between letters) mid-left (300, 315) -> rgb(255, 255, 255) white (letter stroke) y=315 scan: 61 white pixels across the band -> wordmark visible. y=400 scan: 0 white pixels -> clean margin below. CLAUDE.md rule rewritten. The previous version said "after every gh pr merge, run git pull". The new one explains WHY that rule exists (the worktree pattern caused the operator's canonical clone to silently lag behind main, hiding files like public/og-image.png that were freshly committed) and adds the broader rule: do NOT create `git worktree` checkouts; work always from the canonical clone at /Users/miquelmatoses/Claude/cercol. Co-Authored-By: Claude Opus 4.7 (1M context) <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.
og-image
Replaces the Pillow-rendered og-image (which spelled the brand
Cercolwithout the accent and used a plain typeface) with one built from the canonical wordmark SVG that the website header ships.src/assets/brand/cercol-wordmark.svgis a 1:1 copy of the paths insrc/components/CercolLogo.jsx. The React component stays the runtime source of truth; this file is the asset-pipeline copy.scripts/generate_og_image.mjscomposes a 1200x630 SVG (blue<rect>+ nested wordmark withcolor=#ffffff) and rasters it with@resvg/resvg-js. Reproducible:node scripts/generate_og_image.mjs.Pixel-sampled verification on the new output: corners and centre between letters are brand blue (0, 71, 186), letter strokes are white (255, 255, 255), y=315 horizontal scan shows 61 white pixels across the wordmark band, y=400 shows 0 (clean margin below).
CLAUDE.md rule
Rewritten to explain WHY the post-merge
git pullrule exists (the worktree pattern silently desynced the operator's canonical clone, hiding files freshly committed onmain), and adds the broader rule: do NOT creategit worktreecheckouts. Work always from the canonical clone at/Users/miquelmatoses/Claude/cercol.Gates
🤖 Generated with Claude Code