Expand on nav_list styles

- Consolidate SCSS partials

_data/navigation.yml

@@ -23,7 +23,7 @@ main:
 docs:
   - title: Getting Started
     children:
-      - title: "Quick Start Guide"
+      - title: "Quick-Start Guide"
         path: quick-start-guide
       - title: "Installation"
         path: installation

_includes/nav_list

@@ -1,20 +1,20 @@
 {% include base_path %}
 {% assign navigation = site.data.navigation[page.sidebar.nav] %}
 
-<nav>
+<nav class="nav__list">
   <ul>
     {% for nav in navigation %}
-      <li>{{ nav.title }}
+      <li><span class="nav__sub-title">{{ nav.title }}</span>
         {% if nav.children != null %}
         <ul>
           {% for child in nav.children %}
             {% assign nav_url = child.path | prepend: "/" | prepend: page.sidebar.nav | prepend: "/" | append: "/" | prepend: base_path %}
             {% if nav_url contains page.url %}
-              {% assign c = "current" %}
+              {% assign active = "active" %}
             {% else %}
-              {% assign c = "" %}
+              {% assign active = "" %}
             {% endif %}
-            <li><a href="{{ nav_url }}" class="{{ c }}">{{ child.title }}</a></li>
+            <li><a href="{{ nav_url }}" class="{{ active }}">{{ child.title }}</a></li>
           {% endfor %}
         </ul>
         {% endif %}

_includes/sidebar.html

@@ -16,7 +16,7 @@
       {% if s.text %}{{ s.text | markdownify }}{% endif %}
     {% endfor %}
     {% if page.sidebar.nav %}
-      {% include nav_list.html items=page.sidebar.nav %}
+      {% include nav_list items=page.sidebar.nav %}
     {% endif %}
   {% endif %}
   </div>

_includes/toc

@@ -1,6 +1,6 @@
 <aside class="sidebar__right">
 <nav class="toc" markdown="1">
-<header><h4 class="toc__title"><i class="fa fa-{{ include.icon | default: 'book' }}"></i> {{ include.title | default: site.data.ui-text[site.locale].toc_label }}</h4></header>
+<header><h4 class="nav__title"><i class="fa fa-{{ include.icon | default: 'book' }}"></i> {{ include.title | default: site.data.ui-text[site.locale].toc_label }}</h4></header>
 *  Auto generated table of contents
 {:toc .toc__menu}
 </nav>

assets/_scss/_navigation.scss

@@ -212,4 +212,93 @@
       }
     }
   }
+}
+
+
+/*
+   Navigation list
+   ========================================================================== */
+
+.nav__list {
+  a {
+    display: block;
+    padding: 2px 0;
+
+    &:hover {
+      text-decoration: underline;
+    }
+  }
+
+  .active {
+    color: $primary-color;
+    font-weight: bold;
+  }
+}
+
+.nav__title {
+  margin: 0;
+  padding: 10px 20px;
+  font-family: $sans-serif-narrow;
+  font-size: 16px;
+  font-weight: bold;
+  border-bottom: 1px solid $border-color;
+}
+
+.nav__sub-title {
+  display: block;
+  margin: 10px 0;
+  padding: 10px 0;
+  font-family: $sans-serif-narrow;
+  font-size: 14px;
+  font-weight: bold;
+  border-bottom: 1px solid $border-color;
+}
+
+
+/*
+   Table of contents navigation
+   ========================================================================== */
+
+.toc {
+  padding: 0 0 1em;
+  font-family: $sans-serif-narrow;
+  color: $gray;
+  text-transform: uppercase;
+  letter-spacing: 1px;
+  background-color: #fff;
+}
+
+.toc__menu {
+  margin: 0;
+  padding: 0;
+  width: 100%;
+  list-style: none;
+
+  a {
+    display: block;
+    padding: 10px 20px;
+    color: $gray;
+    font-size: 11px;
+    font-weight: bold;
+    line-height: 1.5;
+    border-bottom: 1px solid $border-color;
+
+    &:hover {
+      color: #000;
+      background: $lighter-gray;
+    }
+  }
+
+  li ul > li a {
+    font-weight: normal;
+  }
+
+  // hide sub sub links on small screens
+  li > ul li {
+    display: none;
+
+    @include breakpoint($medium) {
+      display: block;
+    }
+  }
 }

assets/_scss/_toc.scss

@@ -1,55 +0,0 @@
-/* ==========================================================================
-   TABLE OF CONTENTS
-   ========================================================================== */
-
-.toc {
-  padding: 0 0 1em;
-  font-family: $sans-serif-narrow;
-  color: $gray;
-  text-transform: uppercase;
-  letter-spacing: 1px;
-  background-color: #fff;
-}
-
-.toc__title {
-  margin: 0;
-  padding: 10px 20px;
-  font-family: $sans-serif-narrow;
-  font-size: 16px;
-  border-bottom: 1px solid $border-color;
-}
-
-.toc__menu {
-  margin: 0;
-  padding: 0;
-  width: 100%;
-  list-style: none;
-
-  a {
-    display: block;
-    padding: 10px 20px;
-    color: $gray;
-    font-size: 11px;
-    font-weight: bold;
-    line-height: 1.5;
-    border-bottom: 1px solid $border-color;
-
-    &:hover {
-      color: #000;
-      background: $lighter-gray;
-    }
-  }
-
-  li ul > li a {
-    font-weight: normal;
-  }
-
-  // hide sub sub links on small screens
-  li > ul li {
-    display: none;
-
-    @include breakpoint($medium) {
-      display: block;
-    }
-  }
-}

assets/_scss/main.scss

@@ -21,7 +21,6 @@
 @import "notices";
 @import "masthead";
 @import "navigation";
-@import "toc"; // table of contents
 @import "footer";
 @import "syntax";