Docs Site Playground

Code blocks

Last updated

On this page

Code in many languages, coloured the same way Cadence colours it, each block with its language and a copy button. Switch the site between light and dark: the colours change without a reload.

TypeScript#

TypeScript
type Release = { number: number; live: boolean };

export function latest(releases: Release[]): Release | undefined {
  return releases.filter((r) => r.live).sort((a, b) => b.number - a.number)[0];
}

Python#

Python
from dataclasses import dataclass

@dataclass
class Release:
    number: int
    live: bool = False

def latest(releases: list[Release]) -> Release | None:
    live = [r for r in releases if r.live]
    return max(live, key=lambda r: r.number, default=None)

Go#

Go
package main

import "fmt"

func main() {
	fmt.Println("Hello from the docs site")
}

SQL#

SQL
SELECT handle, COUNT(*) AS pages
FROM docs_site_pages
WHERE release_id = $1
GROUP BY handle
ORDER BY pages DESC;

A diff#

Diff
- const revalidate = 300;
+ const revalidate = 60;

A very long line#

This one has to scroll sideways inside the block, never the page:

Shell
curl -X POST "https://api.example.com/v1/sites/acme/releases?include=pages,navigation,headings&format=json&pretty=true" -H "Authorization: Bearer $TOKEN" -H "Content-Type: application/json"

No language#

Plain text in a code block: no colours, still copyable.
    Indentation is kept.

A language the highlighter doesn't know#

++++++++[>++++[>++>+++>+++>+<<<<-]>+>+>->>+[<]<-]>>.