- Rewrite pokes to name the sin itself, not our sample's exact numbers
(a visitor didn't "start at 90" — they mis-set the baseline)
- Remove the "cited:" line from the OG card; citations stay on the page
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XPEvmMbac2fCvKXpQcovj8
Link previews are the funnel for a "send the link" site, so give every sin
a share-optimized card.
- og/twitter meta tags on every page (poke as description, canonical URL,
summary_large_image)
- Per-sin 1200x630 card generated at build: the poke, the before/after
charts (uniform height so tall vconcat charts fit), severity meter,
category, and short citations — composed with satori, rasterized with
@resvg/resvg-js, no browser needed
- Default brand card for the homepage and canon
- Shared chart pipeline extracted to lib/renderChart.ts (used by both the
on-page component and the card generator)
- Bundle three IBM Plex TTF weights for the rasterizer
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XPEvmMbac2fCvKXpQcovj8
The public site (and DOM) shouldn't advertise our tooling choices:
- Drop the design-system credit and typeface note from the footer; replace
with visitor-useful copy ("Built to be sent" / "The canon")
- Remove the external-inspiration reference from the homepage lede
- Neutralize the meta description
- Rename the `cds-` CSS class prefix to `site-`
- Scrub internal names from source comments and the chart theme variable
Functional font-family references are kept; only the advertising is removed.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XPEvmMbac2fCvKXpQcovj8
Make each sin a self-contained page you send instead of re-explaining:
- Per-sin "poke" one-liner (the shareable callout)
- Citations system: a canonical bibliography (src/lib/references.ts) of the
field's giants — Munzner, Knaflic, Tufte, Cairo, Few, Cleveland & McGill,
Wilke, Healy, Calling Bullshit, data-to-viz, Junk Charts, Spurious
Correlations, FT Visual Vocabulary — cited per sin with a relevance note
- "Don't take our word for it" receipts block on each sin
- /canon page: the full annotated bibliography
- Share control: copy-link "send them the receipt" (progressive enhancement)
- Restructured sin page: poke -> proof -> why -> receipts -> share
- Header nav (Sins / Canon); homepage reframed to the "send the link" mission
Also fix the truncated-axis bad chart: clamp the [90,100] domain so the bar
baseline doesn't overflow thousands of pixels off-canvas.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XPEvmMbac2fCvKXpQcovj8
Adopt Carbon at the design-token level (the component libraries ship JS and
target app UIs; this is a static content site):
- IBM Plex Sans/Mono, self-hosted via @fontsource (no external requests)
- Carbon color tokens + layered White / Gray 100 themes
- 8px spacing scale, productive/expressive type, motion tokens, square
geometry, 2px focus ring
- UI-shell header, tile grid, Carbon tags, geometric severity meter,
breadcrumb, colophon crediting Carbon
- Charts themed with IBM Plex + Carbon's data-visualization palette
(validated colorblind-safe/contrast) on a fixed light canvas so the
build-time SVG stays legible in both themes
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XPEvmMbac2fCvKXpQcovj8
The Actions integration token cannot create the Pages site
("Resource not accessible by integration"), so enablement must be done
once in repo settings. Deploy works normally after that.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XPEvmMbac2fCvKXpQcovj8
Set up the static-site tech stack: Astro 5 with Markdown content
collections, Vega-Lite specs rendered to static SVG at build time
(zero client JS), plain scoped CSS, and a GitHub Pages deploy workflow.
Includes three sample sins (truncated y-axis, dual-axis deception,
pie chart overload), each with a bad and fixed chart spec, plus a
gallery index and per-sin detail pages.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XPEvmMbac2fCvKXpQcovj8
Claude