From 0a8138a6e01dd29f00250712ee1ea71242d56557 Mon Sep 17 00:00:00 2001
From: Silvio Giebl <silvio.giebl@hivemq.com>
Date: Mon, 22 Jul 2019 09:33:17 +0200
Subject: [PATCH] Improved navigation

(cherry picked from commit 6684f7c7faa15d6d59df35fbff9ea6666634d754)
---
 _includes/nav.html    | 18 +++++++++---------
 _sass/navigation.scss | 17 +++++++++--------
 2 files changed, 18 insertions(+), 17 deletions(-)

diff --git a/_includes/nav.html b/_includes/nav.html
index fbe159f..e2ef458 100644
--- a/_includes/nav.html
+++ b/_includes/nav.html
@@ -1,28 +1,28 @@
-<ul class="navigation-list">
+<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="navigation-list-item{% if page.url == node.url or page.parent == node.title or page.grand_parent == node.title %} active{% endif %}">
+        <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 -%}
-          <a href="{{ node.url | absolute_url }}" class="navigation-list-link{% if page.url == node.url %} active{% endif %}">{{ node.title }}</a>
+          <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="navigation-list-child-list ">
+            <ul class="nav-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 %}">
+              <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 -%}
-                <a href="{{ child.url | absolute_url }}" class="navigation-list-link{% if page.url == child.url %} active{% endif %}">{{ child.title }}</a>
+                <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="navigation-list-child-list">
+                  <ul class="nav-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 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>
diff --git a/_sass/navigation.scss b/_sass/navigation.scss
index ec529f0..1bc91d5 100644
--- a/_sass/navigation.scss
+++ b/_sass/navigation.scss
@@ -1,22 +1,23 @@
 //
 // Main nav, breadcrumb, etc...
 //
-.navigation-list {
+
+.nav-list {
   padding: 0;
   margin-top: 0;
   margin-bottom: 0;
   list-style: none;
 }
 
-.navigation-list-child-list {
+.nav-list-child-list {
   padding-left: $sp-3;
   list-style: none;
 
-  .navigation-list-link {
+  .nav-list-link {
     color: $nav-child-link-color;
   }
 
-  .navigation-list-item {
+  .nav-list-item {
     position: relative;
 
     &::before {
@@ -35,7 +36,7 @@
   }
 }
 
-.navigation-list-item {
+.nav-list-item {
   @include fs-4;
   margin: 0;
 
@@ -43,18 +44,18 @@
     @include fs-3;
   }
 
-  .navigation-list-child-list {
+  .nav-list-child-list {
     display: none;
   }
 
   &.active {
-    .navigation-list-child-list {
+    .nav-list-child-list {
       display: block;
     }
   }
 }
 
-.navigation-list-link {
+.nav-list-link {
   display: block;
   padding-top: $sp-1;
   padding-bottom: $sp-1;