{% if section_pages %}
  <nav class="sidebar-nav section-nav">
    <h3>In this section</h3>
    <ul class="vertical menu">
      {% for section_page in section_pages %}
        <li class="{% if section_page.is_active %}is-active{% endif %}">
          <a href="{{section_page.url}}">{{ section_page.title }}</a>
        </li>
      {% endfor %}
    </ul>
  </nav>
{% endif %}
{% if article_headings %}
  <div data-sticky-container>
    <div class="sticky" data-sticky data-sticky-on="large" data-margin-top="3" data-top-anchor="on-this-page:top" data-btm-anchor="main-end:bottom">
      <nav class="sidebar-nav article-nav">
        <h3 id="on-this-page">On this page</h3>
        <ul class="vertical menu" data-magellan data-bar-offset="60">
          {% for heading in article_headings %}
            <li>
              <a href="#{{heading.value|slugify}}">{{heading.value}}</a>
              {% if heading.children %}
                <ul>
                  {% for subheading in heading.children %}
                    <li><a href="#{{subheading|slugify}}">{{subheading}}</a>
                  {% endfor %}
                </ul>
              {% endif %}
            </li>
          {% endfor %}
        </ul>
      </nav>
    </div>
  </div>
{% endif %}
