Code block
A code sample, optionally with an HTTP method and path header. Mono carries every identifier, endpoint and sample, exactly as it does in the app.
Samples
$ pnpm --filter @gridd/ui build:tokens ok wrote css/tokens.css - 53 colours, 22 contrast obligations verifiedCopy uses the async clipboard API and reports the outcome. A copy button that always says "Copied!" is lying about the case where the page is not focused or the permission was refused — press it with the tab in the background and watch it say so.
Endpoints
{ "lot_plan": "L14RP80432", "area_m2": 812, "zone": "low_density_residential", "constraints": [{ "type": "flood", "extent_pct": 18 }] } Three token classes only — .tok-key, .tok-str, .tok-num, plus .tok-com for comments. A twelve-colour theme in a docs sample competes with the prose around it.
The dark ground
#14151A in BOTH themes, and that is deliberate.
A code block that inverts with the page means a screenshot in the docs stops matching the docs, and syntax colours tuned for a dark ground have to be re-derived for a light one — two palettes to keep honest instead of one. Switch the theme on this page: everything else moves and the code block does not.
The block scrolls itself rather than making the page scroll sideways, which is the same rule the data table follows.