levineuwirth.org/content/essays/test-essay.md

11 KiB
Raw Blame History

title date abstract tags status confidence importance evidence scope novelty practicality confidence-history history
A Test Essay 2026-03-14 A comprehensive end-to-end exercise of the Hakyll pipeline — typography, code, math, sidenotes, filters, tables, exhibits, and annotations.
meta
Working model 72 3 2 average moderate moderate
55
63
72
date note
2026-03-01 Initial draft
date note
2026-03-14 Expanded typography and citation sections; added math examples

The body typeface is Spectral, a screen-first serif with seven weights and full OpenType support. Old-style figures are enabled by default: the year 2026, the number 1984, Euler's number 2.718. Standard ligatures are active: first, fifty, ffle. The typographic principles informing this layout draw on Butterick[@butterick2019] and Tufte[@tufte1983]. This document is built with Pandoc[@pandoc].

Paragraphs following one another use first-line indentation in the traditional book manner, with no inter-paragraph vertical gap. This is the second paragraph of the opening section, and you should see the indent at the start of this line.

A third paragraph to confirm the indent is consistent across multiple consecutive paragraphs and does not drift or accumulate.

Typography

Headings

Headings are set in Fira Sans Semibold, a humanist sans-serif that complements Spectral. The hierarchy below demonstrates all levels used in practice.

Section heading (H2)

Subsection heading (H3)

Minor heading (H4)

Rarely used (H5)

Body text resumes here, following the heading sequence above. The vertical rhythm above each heading and the transition back to Spectral below it should feel natural, not abrupt.

Inline Elements

This sentence demonstrates bold emphasis (700) and semibold emphasis (600) side by side — the authorial choice the spec describes. Italic text looks like this phrase set in Spectral italic. Combined: bold italic.

Abbreviations use Spectral's true small-caps via the smcp OpenType feature: the organisations NSF, ACLU, and CIA. These should appear as genuine small capitals, not scaled-down full caps.

Superscripts use Spectral's sups glyphs: E = mc^2^, footnote reference^1^, ordinals like 1^st^ and 2^nd^. Subscripts use subs: H~2~O, CO~2~.

Inline code looks like cabal run site -- build and sits comfortably in a line of Spectral body text. The size differential and background tint should clearly distinguish it without being jarring.

Blockquotes

The site is the proof. If a site about careful writing is itself carelessly made, the argument is self-defeating. Every element must earn its presence.

Text resumes after the blockquote without indent — the indent reset rule is working if this line begins flush left.

A nested quotation scenario: this outer blockquote contains ordinary text, establishing the left-border visual hierarchy.

Code

JetBrains Mono is used for all code. Ligatures and contextual alternates are active: -> => != :: >= in inline code, and in blocks below.

-- Hakyll site compiler entry point
module Main where

import Hakyll (hakyll)
import Site   (rules)

main :: IO ()
main = hakyll rules
/* CSS custom property example */
:root {
    --bg:   #faf8f4;
    --text: #1a1a1a;
}

body {
    background-color: var(--bg);
    color: var(--text);
    font-feature-settings: 'liga' 1, 'onum' 1;
}
def greet(name: str) -> str:
    return f"Hello, {name}!"

The code block border, background tint, and monospaced font should feel quiet — part of the page, not a jarring box.

Tables

Tables use Fira Sans at 90% size, with lining figures and tabular spacing enabled for numeric alignment.

Font Role Weight(s) File size
Spectral Body text 400, 600, 700 2124 KB
Fira Sans UI / headings 400, 600 16 KB
JetBrains Mono Code 400 1920 KB

Dark Mode

Use the toggle in the top-right corner of the nav to switch between light and dark. Both themes use warm monochrome palettes derived from the same base hue. The background, text, borders, muted text, code blocks, and blockquote borders should all shift coherently.

Check the following specifically in dark mode: sidenotes, code block backgrounds, the blockquote border, and the table header row. The transition on body should make the switch feel smooth rather than abrupt.

  • Background: #1c1a18 (warm dark, not pure black)
  • Text: #e8e5df (warm off-white, not pure white)
  • Muted text, borders: proportionally darker warm greys

Mathematics

The quadratic formula solves ax^2 + bx + c = 0 for real roots:

x = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a}

This is a well-known result.1 Euler's identity is often cited as the most beautiful equation in mathematics:

e^{i\pi} + 1 = 0

It connects the five most important constants in mathematics.2 The CSS smallcaps filter should catch abbreviations like NASA, HTML, CSS, and API automatically.

Turán's Theorem

The Turán graph T(n,k) is the complete $k$-partite graph on n vertices with part sizes as equal as possible. Its edge count is given by the formula below — this is the identity the moving-vertex argument exploits.

::: {.exhibit .exhibit--equation data-exhibit-name="Turán Edge Count" data-exhibit-type="equation" data-exhibit-caption="Edge count of a complete k-partite graph: total pairs minus same-part pairs."}

:::: exhibit-body

\binom{n}{2} - \sum_{i=1}^{k}\binom{m_i}{2}

::::

:::

Every pair of vertices is adjacent except those within the same part, so the formula counts edges by subtracting same-part pairs from all pairs.

::: {.annotation .annotation--static}

Remark Equal parts maximise edges
Intuitively: if two parts differ in size by more than one vertex, moving a vertex from the larger to the smaller part creates more cross-part pairs than it destroys within-part pairs. The moving-vertex argument below makes this precise.
:::

::: {.annotation .annotation--collapsible}

Note Turán graph definition ▸ expand
The *Turán graph* $T(n,k)$ is the unique (up to isomorphism) complete $k$-partite graph on $n$ vertices whose part sizes differ by at most one. By Turán's theorem, $T(n,k)$ is the $K_{k+1}$-free graph on $n$ vertices with the maximum number of edges.
:::

::: {.exhibit .exhibit--proof data-exhibit-name="Turán Bound" data-exhibit-type="proof" data-exhibit-caption="Moving one vertex from the larger to the smaller part strictly increases the edge count when parts differ by ≥ 2."}

:::: exhibit-body Without loss of generality suppose n_1 - n_2 \ge 2. Form a new complete $k$-partite graph by moving one vertex from part 1 to part 2. Since the new graph is still complete $k$-partite on the same n vertices, it suffices to show it has strictly more edges.

The number of edges in any complete $k$-partite graph M_{m_1,\ldots,m_k} is

\binom{n}{2} - \sum_{i=1}^{k}\binom{m_i}{2},

since every pair of vertices is adjacent except those within the same part. Therefore

|E(G')| - |E(G)| = \binom{n_1}{2} + \binom{n_2}{2} - \binom{n_1-1}{2} - \binom{n_2+1}{2}.

Using \binom{m}{2} = \frac{m(m-1)}{2}, this simplifies to (n_1 - 1) - n_2 = n_1 - n_2 - 1. Since n_1 - n_2 \ge 2, we get |E(G')| - |E(G)| \ge 1 > 0. [□]{.proof-qed} ::::

:::

Music Notation

Score fragments are embedded inline as responsive SVGs, integrated with the gallery focusable system. Clicking the fragment — or the expand glyph that appears on hover — opens the shared overlay. The SVG inherits the page's text color via currentColor, so notation renders correctly in both light and dark modes. The caption below the score is a persistent <figcaption>, in keeping with the convention of printed musical editions.

::: {.score-fragment score-name="Sample Fragment" score-caption="A short excerpt demonstrating inline SVG score embedding with dark-mode-aware notation."} :::

Prose commentary surrounds the fragment just as it would in an analytical text — above to introduce the passage, below to elaborate on what was shown.

External links with domain classes: Wikipedia on the quadratic formula, an arXiv preprint, a DOI link, and jgm/pandoc on GitHub. A generic external: example.com.

An internal link to the essay index is left completely unchanged — no extra classes or attributes added.

Wikilinks: About This Site resolved from [[About This Site]], and The Colophon resolved from [[The Colophon|the colophon]].

Filter Output

Abbreviations

Filters.Typography matches exact Pandoc Str tokens against a table of common Latin abbreviations and wraps them in <abbr title="…"> elements. Hover over the highlighted abbreviations below to see the tooltip.

Common scholarly shorthand: e.g. the quadratic formula, i.e. the formula x = \frac{-b \pm \sqrt{b^2-4ac}}{2a}. See cf. Stewart §3.4. The argument follows from first principles, viz. the moving-vertex technique. NB: the result holds only for k \ge 2.

Smallcaps

Filters.Smallcaps detects runs of three or more uppercase letters and wraps them in <abbr class="smallcaps">. Technology acronyms detected automatically: HTML, CSS, API, JSON, URL, NASA, MIT. Trailing punctuation is stripped before the check so HTTP, and REST. also work correctly.

Not converted: short tokens like I, OK (two letters), or mixed-case tokens like JavaScript, macOS, or LaTeX.

Annotations

::: {.annotation .annotation--static}

Remark On static annotations
This is a static annotation. It is always visible and has no toggle. The border separates the header from the body.
:::

::: {.annotation .annotation--collapsible}

Note On collapsible annotations ▸ expand
This annotation is collapsed by default. The abbreviations i.e. and e.g. should be wrapped in `` tags by `Filters.Typography`. Clicking the button should expand and collapse this body smoothly, with the last line fully visible.
:::

  1. The formula follows directly from completing the square. For a derivation, see any introductory algebra text, e.g. Stewart's Precalculus. ↩︎

  2. This follows from Euler's formula e^{i\theta} = \cos\theta + i\sin\theta evaluated at \theta = \pi. ↩︎