A short tour of what just landed on Marked Share — with live examples in this post so you can see the plumbing instead of only reading about it.

## Apex 1.0.20

Share renders with Apex. **1.0.20** fixes two bugs that showed up on real documents:

1. **Mermaid** fences with edge labels like `A -->|Yes| B` no longer get a fake table separator injected into the diagram source.
2. **Definition lists** next to fences and callouts keep their order — prose after a DL stays before the diagram, not after it.

Older shares that were stored with broken HTML can heal on open via on-read refresh.

## Definition lists

MultiMarkdown / Kramdown-style definition lists work as styled `<dl>` blocks again:

Term
: The thing you are defining.

Mermaid
: Diagrams from fenced `mermaid` blocks, drawn in the browser.

SVG
: Inline vector markup that survives sanitization.

Math
: TeX hooks from Apex (`$…$` / `$$…$$`), typeset when MathJax is enabled on the page.

Another term
: A second definition to show stacking.
: Yes, multiple definitions per term are fine.

## Mermaid

Labeled edges used to corrupt the fence. This graph should render cleanly:

```mermaid
graph TD
  Publish[Publish Markdown] --> Apex[Apex HTML]
  Apex -->|Yes| Mermaid[Client Mermaid]
  Apex -->|No| Plain[Plain pre block]
  Mermaid --> Share[Share page]
```

## SVG

Inline SVG is allowed through sanitization (with dangerous bits scrubbed). A simple mark:

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 48" width="120" height="48" role="img" aria-label="Marked Share mark">
  <rect x="1" y="1" width="118" height="46" rx="8" fill="none" stroke="#261B23" stroke-width="2"/>
  <circle cx="28" cy="24" r="10" fill="#E07A5F"/>
  <circle cx="52" cy="24" r="10" fill="#6B2D7B"/>
  <text x="72" y="29" font-family="system-ui, sans-serif" font-size="14" fill="#261B23">MS</text>
</svg>

## Math

Apex emits math hooks for inline and display TeX. With MathJax on the document page, these typeset; without it you still see the TeX source rather than nothing.

Inline: the identity $e^{i\pi} + 1 = 0$ still hits.

Display:

$$
\int_{-\infty}^{\infty} e^{-x^{2}}\,dx = \sqrt{\pi}
$$

Fenced math blocks are supported the same way Mermaid is (source in a `math` fence until the client runtime picks them up):

```math
\sum_{n=1}^{\infty} \frac{1}{n^{2}} = \frac{\pi^{2}}{6}
```

## Callouts

GitHub-style callouts are enabled in the renderer:

> [!NOTE]
> Front matter (YAML / MMD / Pandoc) is stripped from the **HTML** view only. Raw download and TextBundle still include your source.

> [!TIP]
> A paragraph that starts with `Note:` under an H1 is **not** MultiMarkdown metadata anymore — it stays on the page.

## Front matter and the Word: bug

Two related fixes:

- Leading YAML no longer appears as a thematic break and key/value soup on the share page.
- Undelimited MultiMarkdown metadata stripping only treats conventional keys (`Title`, `Author`, …) as metadata. Prose like `Note: …` or `First span: …` under a heading stays visible. Existing shares that lost an H1 + colon paragraph can refresh on read.

## Highlight share cards

Click a text highlight → share icon on the floating bar → live PNG preview with **Download** and **Copy image**.

The card is square (1080×1080): document title, gradient quote (coral → purple), attribution. Handy for pasting into Slack, Notes, or social without screenshot gymnastics. Open Graph images for `?hl=` links are still a follow-up.

## What else

- Mermaid and callout/SVG styles on document and blog surfaces
- On-read HTML refresh when stored bodies are missing rich media or were corrupted by older Apex
- rubyzip bump for a known CVE

If something still looks wrong on an old link, open it once (refresh heals many cases) or republish. Bugs with a Raw vs rendered diff are especially helpful on [support](https://support.markedapp.com).
