{%- set content = page.content | trim -%}

{#- Remove main heading (first <h1>) -#}
{%- set parts = content.split('</h1>', 1) -%}
{%- if parts | length > 1 and parts[0].startswith('<h1') -%}
  {%- set content = parts[1] -%}
{% endif %}

{#- Remove trailing slash on void elements -#}
{%- set content = content | replace('" />', '">') -%}

{#- Open external links in new tab -#}
{%- set content = content | replace('<a href="http', '<a target="_blank" href="http') -%}

{#- Protect the brand! -#}
{%- set content = content | replace('Q-CTRL', '<span class="text-nowrap">Q-CTRL</span>') -%}

{#-
  Convert code blocks

  This is necessary because we use fenced code blocks to also define Mermaid
  diagrams, so we need to turn this:

  <pre><code class="language-mermaid">...</code></pre>

  into this:

  <pre class="mermaid">...</pre>

  so we're going to start by coverting this:

  <pre><code class="language-anything">...</code></pre>

  to this:

  <pre class="language-anything">...</pre>

  This is a hack and breaks semantics but it's the best zero-config solution we
  have at this point to support both syntax highlighting and Mermaid diagrams.
-#}
{%- set content = content | replace('<pre><code', '<pre') | replace('</code></pre>', '</pre>') -%}
{%- set content = content | replace('<pre class="language-mermaid">', '<pre class="mermaid">') -%}

{#- Convert admonitions -#}
{%- set content = content | replace('<p><strong>Abstract:</strong>', '<p class="admonition admonition-abstract"><strong>Abstract:</strong>') -%}
{%- set content = content | replace('<p><strong>Bug:</strong>', '<p class="admonition admonition-bug"><strong>Bug:</strong>') -%}
{%- set content = content | replace('<p><strong>Danger:</strong>', '<p class="admonition admonition-danger"><strong>Danger:</strong>') -%}
{%- set content = content | replace('<p><strong>Example:</strong>', '<p class="admonition admonition-example"><strong>Example:</strong>') -%}
{%- set content = content | replace('<p><strong>Failure:</strong>', '<p class="admonition admonition-failure"><strong>Failure:</strong>') -%}
{%- set content = content | replace('<p><strong>Important:</strong>', '<p class="admonition admonition-important"><strong>Important:</strong>') -%}
{%- set content = content | replace('<p><strong>Info:</strong>', '<p class="admonition admonition-info"><strong>Info:</strong>') -%}
{%- set content = content | replace('<p><strong>Note:</strong>', '<p class="admonition admonition-note"><strong>Note:</strong>') -%}
{%- set content = content | replace('<p><strong>Question:</strong>', '<p class="admonition admonition-question"><strong>Question:</strong>') -%}
{%- set content = content | replace('<p><strong>Success:</strong>', '<p class="admonition admonition-success"><strong>Success:</strong>') -%}
{%- set content = content | replace('<p><strong>Tip:</strong>', '<p class="admonition admonition-tip"><strong>Tip:</strong>') -%}
{%- set content = content | replace('<p><strong>Warning:</strong>', '<p class="admonition admonition-warning"><strong>Warning:</strong>') -%}

{{- content -}}