From 9b689b28854a604761363a0b12c17fed7f6b6bee Mon Sep 17 00:00:00 2001 From: Ilia Denisov Date: Sun, 31 May 2026 16:32:43 +0200 Subject: [PATCH] fix(site): hide the MathJax assistive-MathML twin (no duplicate formulas) markdown-it-mathjax3 renders each formula as a visible SVG plus a MathML twin () for screen readers, hidden via CSS scoped to a per-container #mjx- selector. In the static build the containers carry no id, so that scoped rule matches nothing and the twin renders as a second, oversized (theme-monospaced) copy of every formula, in every browser. Add a global visually-hidden rule for mjx-assistive-mml in the theme CSS: the twin stays in the DOM for assistive tech but is removed from view and from layout. --- site/.vitepress/theme/custom.css | 23 +++++++++++++++++++++++ 1 file changed, 23 insertions(+) diff --git a/site/.vitepress/theme/custom.css b/site/.vitepress/theme/custom.css index e6baeb8..efa485e 100644 --- a/site/.vitepress/theme/custom.css +++ b/site/.vitepress/theme/custom.css @@ -8,3 +8,26 @@ "Fira Code", "DejaVu Sans Mono", Menlo, Consolas, monospace; --vp-font-family-mono: var(--vp-font-family-base); } + +/* + * markdown-it-mathjax3 renders each formula as a visible SVG plus a MathML + * twin () for screen readers, and hides the twin with CSS + * scoped to a per-container `#mjx-` selector. In the static build the + * containers carry no `id`, so that scoped rule matches nothing and the twin + * shows up as a second, oversized (theme-monospaced) copy of every formula. + * Hide it globally with the standard visually-hidden pattern: it stays in the + * DOM for assistive tech but is removed from view and from layout. + */ +mjx-assistive-mml { + position: absolute !important; + top: 0; + left: 0; + width: 1px !important; + height: 1px !important; + padding: 0 !important; + border: 0 !important; + overflow: hidden !important; + clip: rect(0 0 0 0) !important; + clip-path: inset(50%) !important; + white-space: nowrap !important; +}