Skip to content

Commit 8abe42f

Browse files
committed
style(site): JSDoc tags stay prose-sized but dimmer; highlight meander @example code
Two follow-ups from the previous annotation-prose pass: 1. The @tag markers were too small + monospace — read as UI chrome, not inline prose. Drop the mono family + 0.88em size; keep only `color: var(--muted)` so the tag reads at the same weight and rhythm as surrounding text, just dimmer (it's metadata, not loud). 2. Code blocks inside @example fences rendered plain because meander hydrates them without a language- class, and our global hljs init skips those to avoid auto-coloring random text. cleanupAnnotationProse now runs hljs.highlightElement on every <pre><code> inside .annotation-md. Auto-detection is safe here: the content is always code by the JSDoc contract, so the "plain-text mis-coloring" concern doesn't apply.
1 parent 1ed4c05 commit 8abe42f

2 files changed

Lines changed: 18 additions & 6 deletions

File tree

drag.js

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1014,6 +1014,20 @@
10141014
for (const a of container.querySelectorAll('a[href^="mailto:"]')) {
10151015
a.replaceWith(document.createTextNode(a.textContent ?? ''))
10161016
}
1017+
/* 1b. Highlight any code blocks meander rendered inside the
1018+
* annotation (typically @example fences). These land
1019+
* without a language- class, so the global hljs init
1020+
* (which only touches language-* blocks) skips them. Let
1021+
* hljs auto-detect here — the content is always code per
1022+
* the JSDoc contract, so the "auto-detection mis-colors
1023+
* plain text" risk doesn't apply. */
1024+
if (window.hljs) {
1025+
for (const code of container.querySelectorAll('pre > code')) {
1026+
if (!code.classList.contains('hljs')) {
1027+
window.hljs.highlightElement(code)
1028+
}
1029+
}
1030+
}
10171031
/* 2. Wrap JSDoc tags. Walk text nodes only so we don't
10181032
* disturb existing <a>/<code>/<em> wrappers. A TreeWalker
10191033
* collects the candidates first so we can mutate without

overrides.css

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1686,14 +1686,12 @@ body.col-resizing * {
16861686

16871687
/* JSDoc tag marker (@param, @returns, @throws, @example, …).
16881688
* Set in annotation prose by drag.js's cleanupAnnotationProse
1689-
* after meander hydrates. Reads as metadata — dimmer than body
1690-
* text, slightly larger tracking so the `@tagname` token has
1691-
* visual weight without demanding attention. */
1689+
* after meander hydrates. Same size + family as surrounding
1690+
* prose so the tag still reads as inline text; just dimmer so
1691+
* it recedes as metadata rather than fighting the primary
1692+
* content. */
16921693
.wt-jsdoc-tag {
16931694
color: var(--muted);
1694-
font-family: var(--font-mono);
1695-
font-size: 0.88em;
1696-
letter-spacing: 0.02em;
16971695
}
16981696

16991697
/* ── 8. Code / diff tables ───────────────────────────────────────── */

0 commit comments

Comments
 (0)