notes/_includes/nav.html

<ul class="nav-list">
  {%- assign pages_list = site.html_pages | sort: "nav_order" -%}
  {%- for node in pages_list -%}
    {%- unless node.nav_exclude -%}
      {%- if node.parent == nil -%}
        <li class="nav-list-item{% if page.url == node.url or page.parent == node.title or page.grand_parent == node.title %} active{% endif %}">
          {%- if page.parent == node.title or page.grand_parent == node.title -%}
            {%- assign first_level_url = node.url | absolute_url -%}
          {%- endif -%}
          {%- if node.has_children -%}
            <a href="#" class="nav-list-expander"><svg viewBox="0 0 24 24"><use xlink:href="#svg-arrow-right"></use></svg></a>
          {%- endif -%}
          <a href="{{ node.url | absolute_url }}" class="nav-list-link{% if page.url == node.url %} active{% endif %}">{{ node.title }}</a>
          {%- if node.has_children -%}
            {%- assign children_list = site.html_pages | where: "parent", node.title | sort: "nav_order" -%}
            <ul class="nav-list">
            {%- for child in children_list -%}
              <li class="nav-list-item {% if page.url == child.url or page.parent == child.title %} active{% endif %}">
                {%- if page.url == child.url or page.parent == child.title -%}
                  {%- assign second_level_url = child.url | absolute_url -%}
                {%- endif -%}
                {%- if child.has_children -%}
                  <a href="#" class="nav-list-expander"><svg viewBox="0 0 24 24"><use xlink:href="#svg-arrow-right"></use></svg></a>
                {%- endif -%}
                <a href="{{ child.url | absolute_url }}" class="nav-list-link{% if page.url == child.url %} active{% endif %}">{{ child.title }}</a>
                {%- if child.has_children -%}
                  {%- assign grand_children_list = site.html_pages | where: "parent", child.title | sort: "nav_order" -%}
                  <ul class="nav-list">
                  {%- for grand_child in grand_children_list -%}
                    <li class="nav-list-item {% if page.url == grand_child.url %} active{% endif %}">
                      <a href="{{ grand_child.url | absolute_url }}" class="nav-list-link{% if page.url == grand_child.url %} active{% endif %}">{{ grand_child.title }}</a>
                    </li>
                  {%- endfor -%}
                  </ul>
                {%- endif -%}
              </li>
            {%- endfor -%}
            </ul>
          {%- endif -%}
        </li>
      {%- endif -%}
    {%- endunless -%}
  {%- endfor -%}
</ul>