fix(#5525): distinct Mermaid fullscreen toolbar icon

The Mermaid toolbar's "fit" and "fullscreen" icons rendered byte-identical (the
fullscreen path was fit's corner-brackets drawn twice). Replaced the fullscreen
glyph with a distinct corner-frame + diagonal-expand-arrows icon so the two
actions are visually distinguishable at 14px. Still wired to openLightbox; no
dependency on the old path. (The other half of #5525 — mermaid height:0 on
mobile — does not reproduce on current master; verified live at 390x844.)

Self-built (nesquena-hermes); nesquena independent review APPROVED.

static/ui.js

@@ -1422,7 +1422,7 @@ function _mermaidViewerIcon(kind) {
     zoomOut: '<svg viewBox="0 0 24 24" aria-hidden="true"><circle cx="10" cy="10" r="6"></circle><path d="M7 10h6"></path><path d="M15 15l4 4"></path></svg>',
     reset: '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M6 9V4H1"></path><path d="M1 4l4 4"></path><path d="M10 4a8 8 0 1 1-5.66 13.66"></path></svg>',
     fit: '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M4 9V4h5M20 9V4h-5M4 15v5h5M20 15v5h-5"></path></svg>',
-    fullscreen: '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M4 9V4h5M20 9V4h-5M4 15v5h5M20 15v5h-5M9 4H4v5M15 4h5v5M9 20H4v-5M15 20h5v-5"></path></svg>',
+    fullscreen: '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M4 9V4h5M20 9V4h-5M4 15v5h5M20 15v5h-5"></path><path d="M4 4l5 5M20 4l-5 5M4 20l5-5M20 20l-5-5"></path></svg>',
   };
   return icons[kind] || '';
 }

tests/test_issue5525_mermaid_icon_distinct.py

@@ -0,0 +1,50 @@
+"""Regression coverage for #5525 — Mermaid toolbar fit/fullscreen icons must differ.
+
+Reported alongside the (already-fixed on master) mobile height:0 issue: the
+"fit to screen" and "fullscreen" toolbar icons look identical. Confirmed by
+inspection — the old `fullscreen` glyph was `fit`'s four corner-brackets path
+drawn twice (`...M9 4H4v5M15 4h5v5...`), so it rendered pixel-identical to `fit`.
+
+Fix: give `fullscreen` a distinct glyph (corner frame + outward diagonal expand
+arrows) so the two controls are visually distinguishable.
+"""
+from pathlib import Path
+import re
+
+ROOT = Path(__file__).resolve().parent.parent
+UI = ROOT / "static" / "ui.js"
+
+
+def _icon(kind: str) -> str:
+    """Extract the SVG string for a given _mermaidViewerIcon kind."""
+    src = UI.read_text(encoding="utf-8")
+    # Match `kind: '<svg ...></svg>',` inside the icons map.
+    m = re.search(rf"\b{kind}:\s*'(<svg.*?</svg>)'", src)
+    assert m, f"icon {kind!r} not found in _mermaidViewerIcon"
+    return m.group(1)
+
+
+def test_fit_and_fullscreen_icons_are_distinct():
+    """The two toolbar glyphs must not be byte-identical (they were: #5525)."""
+    fit = _icon("fit")
+    fullscreen = _icon("fullscreen")
+    assert fit and fullscreen
+    assert fit != fullscreen, (
+        "fit and fullscreen mermaid toolbar icons are identical — users can't "
+        "tell the controls apart (#5525)"
+    )
+
+
+def test_fullscreen_icon_has_distinct_expand_arrows():
+    """Fullscreen keeps a corner frame but adds outward diagonal expand arrows,
+    which `fit` does not have — a concrete distinguishing feature."""
+    fit = _icon("fit")
+    fullscreen = _icon("fullscreen")
+    # Diagonal expand strokes from the corners (e.g. "M4 4l5 5") — present in
+    # fullscreen, absent from fit's pure corner-bracket path.
+    assert re.search(r"M4 4l5 5|l5 5|l-5 5|l5 -5", fullscreen), (
+        "fullscreen icon should carry outward diagonal expand arrows"
+    )
+    assert not re.search(r"l5 5|l-5 5", fit), (
+        "fit icon should stay corner-brackets only (no diagonal arrows)"
+    )