xrpl-dev-portal/tool/template-sidebar_nav.html

<div class="guide_toc">
  <div id="sidenav_accordion" class="panel-group" role="tablist" aria-multiselectable="true">
    {% for cat in categories %}
    <div class="panel panel-default{% if currentpage.category == cat %} active{% endif %}">
      <div class="panel-heading" role="tab" id="sidenav_cat_head_{{loop.index}}">
        <h5 class="panel-title">
          <a {% if currentpage.category != cat %}class="collapsed"{% endif %} role="button" data-toggle="collapse" data-parent="#sidenav_accordion" href="#sidenav_collapse_{{loop.index}}" aria-expanded="true" aria-controls="sidenav_collapse_{{loop.index}}">
            {{ cat }}
          </a>
        </h5>
      </div><!-- /.panel-heading -->

      <div id="sidenav_collapse_{{loop.index}}" class="collapse{% if currentpage.category == cat %} in{% endif %}" role="tabpanel" aria-labelledby="sidenav_cat_head_{{loop.index}}">
        <div class="panel-body">
          <ul class="sidebar_cat_pagelist">
          {% set nosubcatpages = pages|selectattr("category", "equalto", cat)|selectattr("subcategory", "undefined") %}
          {% for page in nosubcatpages %}
            <li class="nosubcat-page"><a href=" {{ page.html }}">{{ page.name }}</a></li>
          {% endfor %}

          {% set subcatpages = pages|selectattr("category", "equalto", cat)|selectattr("subcategory", "defined") %}
          {% for subcat in subcatpages|groupby("subcategory") %}
            {% if subcat.list[0].name != subcat.grouper %}
            <li class="subcategory_title"><a>{{ subcat.grouper }}</a></li>
            {% else %}
            <li class="subcategory_title"><a href="{{subcat.list[0].html}}">{{ subcat.grouper }}</a></li>
            {% endif %}
            {% for page in subcat.list if page.name != subcat.grouper %}
              {% if page == currentpage %}
              <li><a class="active subpage" href="#main_content_body">{{ page.name }}</a></li>
              {% else %}
              <li><a class="subpage" href="{{ page.html }}">{{ page.name }}</a></li>
              {% endif %}
            {% endfor %}
          {% endfor %}
          </ul>
        </div><!-- /.panel-body -->
      </div><!-- /#sidenav_collapse{{loop.index}} -->

    </div><!-- /.panel -->
    {% endfor %}

  </div><!-- /#sidenav_accordion -->
</div><!-- /.guide_toc -->