Theme Feature Test /2026-05-18

This post tests all theme features: footnotes, table of contents, images, figures, code blocks, tables, and blockquotes.

Headings and TOC

The table of contents on the right sidebar is generated from h2, h3, and h4 headings. On wide screens, h3 and h4 are nested under their parent h2 with a collapsible toggle.¹

Nested Level 3 Heading

This is a level-3 heading nested under the first H2. It should appear indented in the TOC.

Even Deeper Level 4

Level-4 headings nest further under H3. They use a smaller font and lighter color in the TOC.

Another Level 3 Under Same H2

This tests multiple H3 siblings under one H2 parent.

Footnotes System

Basic footnotes

This paragraph contains a footnote reference to demonstrate the dynamic sidenotes.² On wide screens (>800px), footnotes appear in the left sidebar, aligned with their references. On narrow screens, they collapse into inline containers below each paragraph.³

Dense footnotes (overlap test)

This single sentence has three footnote references packed close together⁴⁵⁶ — they should not overlap in the sidenotes sidebar. The overlap-prevention logic enforces a minimum vertical gap between consecutive footnotes, pushing later ones down when needed.

Footnotes with code

A footnote can contain inline code like dplyr::mutate() or even a code block:⁷

Footnotes with mixed content

A footnote can also contain a blockquote⁸ or other block-level elements. The typography scales down proportionally so the content doesn’t look mismatched next to the plain-text footnotes.

Images and Figures

A standalone image:

An image wrapped in a <figure> with a caption:

This image is 1200px wide — wider than the article (~800px) but fits within the layout (~1400px), so it auto-expands:

This image is 1600px wide — exceeds the layout width, so it keeps its original size (scrollbar if needed):

HTML Widgets and Iframes

This iframe is 1200px wide — wider than the article but fits within the layout, so it auto-expands:

Code Blocks

Code blocks use Monokai highlighting with line numbers. Here is an R example:

# A simple linear model
set.seed(123)
x <- rnorm(100)
y <- 2 * x + rnorm(100, sd = 0.5)
fit <- lm(y ~ x)
summary(fit)

Wide Code Block - Fits Layout (will expand)

This code block is wider than the article (~800px) but fits within the layout (~1400px), so it will auto-expand to full width:

# At 14px monospace, this line is ~1000px wide — fits in 1400px layout but overflows 800px article
data_summary <- data.frame(variable = names(mtcars), mean = colMeans(mtcars), sd = apply(mtcars, 2, sd), median = apply(mtcars, 2, median))

Very Wide Code Block - Exceeds Layout (will NOT expand)

This code block is wider than the full layout — expanding would not eliminate the scrollbar, so it keeps its original scrollbar:

# This very long line should trigger the fullwidth auto-detection when it exceeds the article column width
result <- data.frame(x = rnorm(1000), y = rnorm(1000), category = sample(c("treatment_a", "treatment_b", "control_group_placebo"), 1000, replace = TRUE), value = runif(1000), description = "This is a very wide data frame construction line that demonstrates the fullwidth feature for code blocks with horizontal overflow")

A Python example:

def fibonacci(n: int) -> list[int]:
    """Return the first n Fibonacci numbers."""
    seq = [0, 1]
    for _ in range(2, n):
        seq.append(seq[-1] + seq[-2])
    return seq[:n]

print(fibonacci(10))

Tables

A normal table:

Wide Table - Fits Layout (will expand)

This table has 8 columns with long URLs that make it wider than the article (~1000px) but still narrower than the layout (~1400px):

Blockquotes

This is a blockquote. It has a subtle left border and muted text color.

Blockquotes can span multiple paragraphs. The styling is intentionally understated to match the theme’s minimalist design.

Inline Elements

This sentence contains bold text, italic text, and inline code. Links like this one have a dashed underline that turns solid on hover.