ReferenceReview every design-system element with dummy content.

Template zoo

This page collects every design-system element in one place, with dummy content, for visual and accessibility review (STUDENT_DOCS_PLAN.md Phase C). It renders in the Developer zone; open any student page for the light/dark student schemes and any Teach page for the navy scheme. The zone banner above is the live one for this page.

Page-type badges

The badge row at the top of this page is generated from front-matter. All badge variants:

Tutorial Concept How-to Reference Example Troubleshooting

Level chips

First steps Core Advanced Specialized

Hero band (blueprint motif)

A hero band. The faint grid appears only here, in section-index headers, and in empty-state illustrations, never behind body text.

Embedded demo (drafting sheet)

from drafter import *
from dataclasses import dataclass


@dataclass
class State:
    message: str


@route
def index(state: State) -> Page:
    return Page(state, [
        "The zoo says: " + state.message + "\n",
        Button("Visit again", "index"),
    ])


start_server(State("hello"))

Admonitions

Note

A restrained note. Used for asides that most readers can skip.

Careful

A warning. Used when a likely action loses work or misleads.

Deeper

A pointer to a deeper treatment on a concept or Extend page.

Code block (static)

from drafter import *

bold("This block is highlighted but not compiled into a demo.")

Table

Component	Group	Level
Button	Actions	Core
Map	Place	Specialized

Cards

A card title

Card body text with a link.
Another card

Cards are used on index pages and for next-step navigation.