First post
How we applied the parchment redesign to Markdown-powered pages.
First post
This post documents the design lift: from adding GitHub-flavoured Markdown styles to threading the parchment canvas through every PHP layout.
Highlights
- New typography pairing: Agbalumo for headlines, Onest for body copy and UI labels.
- GitHub-friendly Markdown skin for tables, task lists, and code blocks.
- Slot-driven heroes and CTAs so pages stay configurable via front matter.
What changed under the hood
Markdown supports bold, italic, lists, links, and inline code likeecho "hi";. With the redesign, those elements inherit:
- Inked underlines on hover.
- Softer list bullets and task list checkboxes.
- Parchment-backed code blocks with consistent padding.
Media examples
Images with Markdown:Or with a caption:
Quick callouts
- Keep images in
/public/images/so they benefit from the shared sizing and borders. - Update
lastmodwhen you refresh content—the sitemap and feeds use it. - Reference
redesign/markdown-demo.htmlwhenever you need to check Markdown tokens in isolation.
Use the front matter block at the top of the Markdown file—add Keep images under Quick answers
title, description, date, author, keywords, and faq to power structured data./public/images, reference them with Markdown or ``, and the templates handle captions and lazy loading.