Block showcase

This is a sample paragraph with bold, italic, strikethrough, underline, inline code and a link to the home page. A second sentence keeps the line long enough to wrap on a phone.

Heading one

Text under the first heading.

Heading two

Text under the second heading.

Heading three

Text under the third heading.

• First bullet
• Second bullet
  • Nested bullet
  • Another nested bullet
• Third bullet

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

• Done item
• Open item

A quote block. Keep it short and let it carry the point.

type Post = { slug: string; title: string };

export async function getPost(slug: string): Promise<Post | null> {
  const res = await fetch(`/api/posts/${slug}`);
  return res.ok ? res.json() : null;
}

pnpm install && pnpm dev

The last paragraph, after the divider.

More blocks

Heading four

Text under the fourth heading.

Toggle heading two

Content hidden inside a toggle heading.

• It can hold lists
• And other blocks

1. Parent step
   • Nested bullet under a numbered item
   • Another nested bullet
2. Second parent step
   1. Nested numbered item
   2. Another nested numbered item

A quote with children.

A second line inside the same quote.

Tables

Code

{ "name": "ttsalpha-site", "private": true, "scripts": { "dev": "next dev" } }

.card {
  display: grid;
  gap: 16px;
  color: #0d0d0d;
}

select slug, title from posts where status = 'Published' order by published_at desc;

def slugify(title: str) -> str:
    return "-".join(title.lower().split())

A plain text block with no highlighting.

Media

Layout

echo "code in a column"

Above this line is an empty paragraph, and below is a divider.

The very last paragraph.