pynezz.dev
login

Callouts, then and now

Callouts, then and now

Part of the first CMS attempt was a hand-rolled markdown-to-HTML converter, mostly because I wanted to know how markdown parsers actually work rather than because it was the fastest path to a working site. It wasn't - but it did produce this, at one point:

terminal output from an early parser run

The old syntax

Obsidian's callout convention formats a blockquote with a type tag:

>[!tip]
>Here's a tip callout

and I was parsing that by hand into inline-styled <blockquote> elements - colors, padding, and all baked directly into the HTML string, one fmt.Sprintf at a time:

tip and quote callouts rendered by the hand-rolled parser

note and warning callouts

It worked, for the handful of callout types I'd defined. But every new type meant another case in a growing switch statement, and the styling lived in Go source rather than CSS, which meant a palette change meant a recompile.

The current approach

This site's renderer (renderers/mdrender) doesn't parse callouts by hand at all - it's a small Goldmark extension that hooks into the parser Goldmark already has, recognizing a fenced directive instead of a blockquote:

:::tip
Here's a tip callout
:::

Goldmark emits a <div class="callout callout-tip">, and every visual decision - color, spacing, border - lives in design/neumorph.css where it belongs. Adding a new callout type is a CSS rule, not a parser change.

Different syntax, same idea two years apart: markdown prose shouldn't have to know what color a warning box is.

Menu
Observatory A+ 120