Skip to main content
On this page

· 3 min read

Kitchen Sink

This is the single markdown regression page for the React example. It gives you one obvious place to verify alerts, math, GFM, code block chrome, and prose styling in the rendered output.

For how this example is wired, use the rest of the guide: content collections, SSG entry, layouts, Vite config, and search integration are documented there.

Note

This page intentionally stacks many features. In real docs, prefer focused content and use a page like this only for regression coverage.

GFM mix

Feature Example
Strikethrough old new
Task list See below
  • Task done
  • Task open

Alerts

Tip

Short tip callout.

Important

Important callout.

Warning

Warning callout.

Caution

Caution callout.

Code blocks

Titled frame + line highlight:

sample.ts
export function one() {  return 2;}

Collapsed boilerplate:

collapsed.ts
tail();

Tabs (consecutive titled fences):

TypeScript
export type Box = { v: number };
Python
Box = {"v": 0}

Diff-style fence:

Diff
- const port = 3000+ const port = Number(process.env.PORT) || 3000

Math

Inline and display:

Big-O line in prose: sorting is often for keys.

Quotes and prose

Outer quote

Nested level

“It’s fine” to rely on smart typography---within prose, not inside code.

Quick reference

Feature Syntax hint
Bold **x**
Inline math $x$
Alert > [!NOTE]
Code title fenced block with title="..." meta
Collapse fenced block with collapse={...} meta

Footnotes

Pagesmith keeps footnotes working across the example builds1.

This is the only markdown showcase page in this example. The rest of the guide explains the implementation.

Footnotes

  1. This is a lightweight regression check for the shared markdown pipeline. ↩