_includes: Update nav.html for v0.3.0

_includes/nav.html

-<nav role="navigation" aria-label="Main navigation">
-  <ul class="navigation-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="navigation-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 -%}
-            <a href="{{ node.url | absolute_url }}" class="navigation-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="navigation-list-child-list ">
-                {%- for child in children_list -%}
-                  <li class="navigation-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 -%}
-                    <a href="{{ child.url | absolute_url }}" class="navigation-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="navigation-list-child-list">
-                        {%- for grand_child in grand_children_list -%}
-                          <li class="navigation-list-item {% if page.url == grand_child.url %} active{% endif %}">
-                            <a href="{{ grand_child.url | absolute_url }}" class="navigation-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>
-</nav>
-{% if site.nav_links != nil %}
+<ul class="nav-list">
+  {%- assign ordered_pages_list = site.html_pages | where_exp:"item", "item.nav_order != nil" -%}
+  {%- assign unordered_pages_list = site.html_pages | where_exp:"item", "item.nav_order == nil" -%}
+  {%- if site.nav_sort == 'case_insensitive' -%}
+    {%- assign sorted_ordered_pages_list = ordered_pages_list | sort_natural:"nav_order" -%}
+    {%- assign sorted_unordered_pages_list = unordered_pages_list | sort_natural:"title" -%}
+  {%- else -%}
+    {%- assign sorted_ordered_pages_list = ordered_pages_list | sort:"nav_order" -%}
+    {%- assign sorted_unordered_pages_list = unordered_pages_list | sort:"title" -%}
+  {%- endif -%}
+  {%- assign pages_list = sorted_ordered_pages_list | concat: sorted_unordered_pages_list -%}
+  {%- for node in pages_list -%}
+    {%- unless node.nav_exclude -%}
+      {%- if node.parent == nil and node.title -%}
+        <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 = pages_list | where: "parent", node.title -%}
+            <ul class="nav-list">
+            {%- for child in children_list -%}
+              {%- unless child.nav_exclude -%}
+                <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 = pages_list | where: "parent", child.title | where: "grand_parent", node.title -%}
+                    <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>
+              {%- endunless -%}
+            {%- endfor -%}
+            </ul>
+          {%- endif -%}
+        </li>
+      {%- endif -%}
+    {%- endunless -%}
+  {%- endfor -%}
+</ul>
+{%- if site.nav_links != nil -%}
 <hr>
-<nav role="navigation" aria-label="Secondary navigation">
-  <ul class="navigation-list">
-    {% for link in site.nav_links %}
-    <li class="navigation-list-item">
-      <a href="{{ link.last }}" class="navigation-list-link" target="_blank">{{ link.first }}</a>
-    </li>
-    {% endfor %}
-  </ul>
-</nav>
-{% endif %}
+<ul class="nav-list">
+  {%- for link in site.nav_links -%}
+  <li class="nav-list-item">
+    <a href="{{ link.last }}" class="nav-list-link">{{ link.first }}</a>
+  </li>
+  {%- endfor -%}
+</ul>
+{%- endif -%}