#html

const branch = await $`git branch --show-current`;
await $`dep deploy --branch=${branch}`;

 {
  background-color: oklch(from var(--base-color) calc(l - 0.15) c h);
}

• mind-elixir is another option that lets you edit mindmaps and serialize in its own format
• jsmind is yet another but docs are in Chinese
• elkjs seems a good option for laying out nodes in an architecture-style flow diagram

• O3 is better at finding bugs than Jules, which tends to try and fix them rather than discover them.
• Codex writes more minimal edits in PRs than Jules, which is more verbose.
• Claude Code remains the best at faithfully creating and updating front-end apps.

• --no-highlight skips code-highlighting. --highlight=pygments adds Pygments styling
• --wrap=none doesn't wrap the content in a single block
• --number-sections adds section numbering (<h2>1. Introduction</h2>)
• --shift-heading-level-by=NUM – shift all headings by NUM levels (e.g., start at <h2> instead of <h1>)
• pandoc -f markdown-auto_identifiers drops the auto-identifiers extension that generates id=... for each heading
• pandoc -f gfm uses GitHub flavored Markdown. Run pandoc --list-extensions=gfm to identify the extensions it uses.
• Pandoc's Markdown extension examples are quite extensive.
• Auto-enabled GFM extensions:
  • alerts: GitHub-style callouts (info, tip, warning) via > [!TYPE] blocks.
  • autolink_bare_uris: Turns bare URLs into links, without needing <...>.
  • emoji: Parses :smile:-style codes into Unicode emoji characters.
  • footnotes: Enables footnote syntax with [^id] and definitions at the bottom.
  • gfm_auto_identifiers: Uses GitHub’s heading-ID algorithm: spaces → dashes, lowercase, removes punctuation.
  • pipe_tables: Enables table.
  • raw_html: Raw HTML is unchanged.
  • strikeout: Enables strikethrough with ~~text~~.
  • task_lists: Parses - [ ] and - [x] items as checkboxes.
  • yaml_metadata_block: YAML front matter for document metadata, e.g. <title>
• GFM extensions worth enabling:
  • ascii_identifiers: Strips accents/non-Latin letters in automatically generated IDs.
  • bracketed_spans: [Warning]{.alert} becomes <span class="alert">
  • definition_lists: Term\n: Definition text becomes a definition list
  • fenced_divs: ::: {.note} block creates a <div class="note">...</div>
  • implicit_figures: Standalone images become <figure> with <figcaption>.
  • implicit_header_references: [Section] is treated as [Section][#section]
  • raw_attribute: <b>bold</b>{=html} is inserted as HTML
  • smart: Converts straight quotes to curly, -- to en-dash, --- to em-dash, ... to ellipsis.
  • subscript & superscript: E.g. H~2~O and E = mc^2^

• There's nothing to install
• Private by default: data stays with client
• Speed: no latency

• latexmlmath converts TeX to MathML.
• m|math { font-family: "Noto Sans Math", "Noto Sans" } is a popular OpenType Math font. Browsers default to native fonts: e.g. Cambria Math on windows. Explore at https://fred-wang.github.io/MathFonts/.
• The people working on this at arXiv are: Deyan Ginev, Fred Wang, and Norbert Preining. Their work is sponsored by NSF.

• Useful for: Document conversion, Thumbnail generation, Text extraction, Merging / splitting documents

• Remove redundant tags and attributes (e.g. accessibility, etc.). Explore readability.
• Add a unique gid to each element.
• Add the screenshot WITH a "Set of Marks" - "SoM" (read research paper) highlighting important clickable elements.
• Code output is brittle. Use tools / DSL - e.g. visit_url(url), click_element(text, gid, tagName), etc.

1. Different URLs. E.g. https://example.org/about/ vs https://example.org/about.md (this is how Jekyll or Hugo work). Use for static sites generators.
2. JavaScript. Inject after Markdown: <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script><script>document.body.innerHTML = marked(document.body.textContent);</script>. Use for dynamically generated static sites.
3. URL query parameters. E.g. ?format=markdown vs ?format=html vs ?format=json. Use in APIs.
4. Content Negotiation. Based on the user agent and Accept header, serve Markdown or HTML. Send Vary: Accept to indicate that the response depends on the Accept header. Use for dynamic web apps.

• Autocomplete and tab completion works perfectly, out-of-box.
• Syntax highlighting is beautiful
• Great multi-line editing

• GitHub Pages: Static websites, medium files
• Cloudflare Pages: Static websites, global delivery
• Vercel: Frontend frameworks (e.g. Next.js) with high DX and ISR, small files
• Netlify: JAMstack projects, minimal back-end, moderate files
• Glitch: Small static projects
• Render: Full-stack apps requiring databases and server-side compute
• Firebase Hosting: Small sites, limited large files
• Archive.org: Public archival, large files
• Google Drive: File sharing, large files
• Dropbox: File sharing, moderate files
• Cloudflare R2: Static assets, large file delivery

• htmx client side templates do can convert JSON to HTML.

• Jekyll - Ruby - 2008
• MkDocs - Python - 2014
• GitBook - JavaScript (Node.js) - 2014
• MkDocs Material - Python (MkDocs-based) - 2016
• Docsify - JavaScript - 2016
• MdBook - Rust - 2017
• Antora - JavaScript (Node.js) - 2017
• Docusaurus - JavaScript (React) - 2017
• JupyterBook - Python - 2019
• Keenwrite - Java - ~2019
• Honkit - JavaScript (GitBook fork) - 2019
• Nextra - JavaScript (Next.js) - 2020
• Astro - JavaScript/TypeScript - 2021
• Hugo Book - Go (Hugo-based) - ~2020
• Clowncar - JavaScript/Node.js - ~2021
• Quarto - R and Python - 2022
• Starlight - JavaScript/TypeScript - 2023