{% import "macros/code-examples.html" as code_examples %}
{% extends "layouts/three-col.html" %}

{% block left_side %}
<div class="outline">
  <div class="outline__content">
    <ul>
      <li>
        <a href="{{ root_section.permalink }}"
          class="outline-item {% if section_or_page and section_or_page.permalink == root_section.permalink %}active{% endif %}">
          <span>{{ root_section.title }}</span>
        </a>
      </li>
      {% for page in root_section.pages %}
      <li>
        <a href="{{ page.permalink }}"
          class="outline-item {% if section_or_page and section_or_page.permalink == page.permalink %}active{% endif %}">{{
          page.title }}</a>
      </li>
      {% endfor %}
    </ul>
  </div>
</div>
{% endblock left_side %}

{% block content %}
<article class="markdown-body">
  {{ code_examples::process_code_block(content=section_or_page.content) | safe }}
  <!-- {{ section_or_page.content | safe }} -->
</article>
{% endblock content %}