Rendering check — every element on one page

This page exists to be looked at. It puts every markdown element the blog can produce on a single screen, so a typography regression shows up in one screenshot instead of being found later on a real article.

Why a fixture instead of a real article

Prose styles for the blog live in app/pages/blog/[...slug].vue under .prose :deep(...), because ContentRenderer output falls outside Vue's scoped-style boundary. That means a missing selector doesn't throw — the element just renders unstyled and nobody notices until a reader hits it. A fixture that uses every element turns a silent gap into a visible one.

What this checks

1. Heading scale and spacing across h2 and h3
2. Body measure, line height, and paragraph rhythm
3. List, table, quote, and code block treatment
4. Link colour against the surrounding text

Text-level elements

Body copy sits at 16px with a 1.75 line height, which puts a comfortable measure inside the 720px column. Bold text should read heavier without jumping baseline. Inline code such as queryCollection('blog_en') needs a tinted background that doesn't swallow the surrounding line. A link to the pricing page should be distinguishable from body text by colour alone, since underlines are off.

A quote is set with a left rule and muted text. It should feel like an aside, not a heading.

Lists

Unordered:

• One item, short.
• A second item long enough to wrap onto a second line, so the indent of the wrapped line can be checked against the marker rather than the text.
• A third item.

Ordered:

1. First step
2. Second step
3. Third step

A table

Tables scroll horizontally inside their own container rather than pushing the page wide.

A code block

// content.config.ts — the two collections differ only in `source`
blog_en: defineCollection({
  type: 'page',
  source: { include: 'en/blog/**', prefix: '/blog' },
  schema: blogSchema,
})

After the horizontal rule above, spacing should reset cleanly into a final paragraph. If anything on this page looks unstyled, the missing selector is in .prose :deep(...).