Added support for multiple first-level sidebar headings (#46)

* Added support for multiple first-level sidebar headings * version bump and adding example of second top level menu Signed-off-by: vsoch <[email protected]> Co-authored-by: vsoch <[email protected]>
vsoch · Jul 17, 2021 · a3e309e · a3e309e
1 parent b5f32a1
commit a3e309e
Show file tree

Hide file tree

Showing 5 changed files with 60 additions and 31 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -14,6 +14,7 @@ Critical items to know are:
  - changed behaviour
 
 ## [master](https://github.com/vsoch/docsy-jekyll/tree/master)
+ - sidebar fix to support multiple top level menus (0.0.23)
  - added support for github_branch (default 'master') in config (0.0.22)
  - adding support in footer to icon and link to linkedin url (0.0.21)
  - updating repository with copyright notice, google analytics bug fix (0.0.2)

diff --git a/VERSION b/VERSION
@@ -1 +1 @@
-0.0.22
+0.0.23
diff --git a/_data/toc.yml b/_data/toc.yml
@@ -10,14 +10,14 @@
           url: "docs/getting-started#development"
         - title: Customization
           url: "docs/getting-started#customization"
-    - title: "Extras"
-      url: "docs/extras"
-      children:
-        - title: Quizzes
-          url: "docs/extras/example-quiz"
-        - title: Tags Page
-          url: "tags"
     - title: "About"
       url: "about"
     - title: "News"
       url: "news"
+- title: "Extras"
+  url: "docs/extras"
+  links:
+    - title: Quizzes
+      url: "docs/extras/example-quiz"
+    - title: Tags Page
+      url: "tags"
diff --git a/_docs/extras/index.md b/_docs/extras/index.md
@@ -12,7 +12,6 @@ but can further enhance your documentation pages. Currently, we have support
 for adding interactive quizzes.
 
  - [Quizzes](example-quiz)
+ - [Tags]({{ site.baseurl }}/tags/)
 
-
-Would you like to see another question type, or another kind of extra? Please
-[open an issue])({{ site.repo }}/issues/new).
+Would you like to see another question type, or another kind of extra? Please [open an issue]({{ site.repo }}/issues/new).
diff --git a/_includes/sidebar.html b/_includes/sidebar.html
@@ -1,25 +1,54 @@
-<div id="td-sidebar-menu" class="td-sidebar__inner">  
+<div id="td-sidebar-menu" class="td-sidebar__inner">
+
   <form class="td-sidebar__search d-flex align-items-center">
- <input type="search" class="form-control td-search-input" placeholder="&#xf002 Search this site…" aria-label="Search this site…" autocomplete="off">
-    <button class="btn btn-link td-sidebar__toggle d-md-none p-0 ml-3 fas fa-bars" type="button" data-toggle="collapse" data-target="#td-section-nav" aria-controls="td-docs-nav" aria-expanded="false" aria-label="Toggle section navigation">
-    </button>
+    <input type="search" class="form-control td-search-input" placeholder="&#xf002 Search this site…" aria-label="Search this site…" autocomplete="off">
+      <button class="btn btn-link td-sidebar__toggle d-md-none p-0 ml-3 fas fa-bars" type="button" data-toggle="collapse" data-target="#td-section-nav" aria-controls="td-docs-nav" aria-expanded="false" aria-label="Toggle section navigation">
+      </button>
   </form>  
+
   <nav class="collapse td-sidebar-nav pt-2 pl-4" id="td-section-nav">
-{% for section in site.data.toc %}<ul class="td-sidebar-nav__section pr-md-3">
-  {% capture sectionUrl %}{{ section.url | replace: "/", "" }}{% endcapture %}
-  {% capture pageUrl %}{{ page.url | replace: "/", "" }}{% endcapture %}
-  <li class="td-sidebar-nav__section-title">
-    <a  href="{% if section.url %}{{ site.baseurl }}/{{ section.url }}{% else %}{{ section.external_url }}{% endif %}" class="align-left pl-0 pr-2 active td-sidebar-link td-sidebar-link__section">{{ section.title }}</a>
-  </li>{% if section.links %}<ul>
-    <li class="collapse show" id="{{ section.title | slugify }}">
-        <ul class="td-sidebar-nav__section pr-md-3">{% for entry in section.links %}
-          <li class="td-sidebar-nav__section-title">
-            <a href="{% if entry.url %}{{ site.baseurl }}/{{ entry.url }}{% else %}{{ entry.external_url }}{% endif %}" class="align-left pl-0 pr-2 td-sidebar-link td-sidebar-link__section">{{ entry.title }}</a>
-          </li>
-          {% if page.url contains entry.url or pageUrl == sectionUrl %}
-          <ul><li class="collapse show" id="{{ child.title | slugify }}">{% if entry.children %}
-              {% for child in entry.children %}<a class="td-sidebar-link td-sidebar-link__page " id="m-{{ section.title | slugify }}-{{ entry.title | slugify }}-{{ child.title | slugify }}" href="{% if child.url %}{{ site.baseurl }}/{{ child.url }}{% else %}{{ child.external_url }}{% endif %}">{{ child.title }}</a>{% endfor %}
-              {% endif %}</li></ul>{% endif %}{% endfor %}
-    </ul>{% endif %}{% endfor %}
+    {% for section in site.data.toc %}
+      <ul class="td-sidebar-nav__section pr-md-3">
+        {% capture sectionUrl %} 
+          {{ section.url | replace: "/", "" }} 
+        {% endcapture %}
+        {% capture pageUrl %} 
+          {{ page.url | replace: "/", "" }} 
+        {% endcapture %}
+
+        <li class="td-sidebar-nav__section-title">
+          <a  href="{% if section.url %}{{ site.baseurl }}/{{ section.url }}{% else %}{{ section.external_url }}{% endif %}" class="align-left pl-0 pr-2 active td-sidebar-link td-sidebar-link__section">{{ section.title }}</a>
+        </li>
+        {% if section.links %}
+          <ul>
+            <li class="collapse show" id="{{ section.title | slugify }}">
+              <ul class="td-sidebar-nav__section pr-md-3">
+                {% for entry in section.links %}
+                  <li class="td-sidebar-nav__section-title">
+                    <a href="{% if entry.url %}
+                                {{ site.baseurl }}/{{ entry.url }}
+                             {% else %}
+                                {{ entry.external_url }}
+                             {% endif %}" 
+                       class="align-left pl-0 pr-2 td-sidebar-link td-sidebar-link__section">{{ entry.title }}
+                    </a>
+                  </li>
+                  {% if page.url contains entry.url or pageUrl == sectionUrl %}
+                    <ul>
+                      <li class="collapse show" id="{{ child.title | slugify }}">
+                        {% if entry.children %}
+                          {% for child in entry.children %}
+                            <a class="td-sidebar-link td-sidebar-link__page " id="m-{{ section.title | slugify }}-{{ entry.title | slugify }}-{{ child.title | slugify }}" href="{% if child.url %}{{ site.baseurl }}/{{ child.url }}{% else %}{{ child.external_url }}{% endif %}">{{ child.title }}</a>{% endfor %}
+                        {% endif %}
+                      </li>
+                    </ul>
+                  {% endif %}
+                {% endfor %}
+              </ul>
+            </li>
+          </ul>
+        {% endif %}
+      </ul>
+    {% endfor %}
   </nav>
 </div>