hide expand/collapse button on nav if there are no expandable items

Author: mojavelinux

src/js/01-nav.js

@@ -39,7 +39,17 @@
 
   fitNavInit({})
 
-  if (navMenuToggle) {
+  find(menuPanel, '.nav-item-toggle').forEach(function (btn) {
+    btn.addEventListener('click', toggleActive.bind(btn.parentElement))
+    var nextElement = btn.nextElementSibling
+    if (nextElement && nextElement.classList.contains('nav-text')) {
+      nextElement.style.cursor = 'pointer'
+      nextElement.addEventListener('click', toggleActive.bind(btn.parentElement))
+    }
+  })
+
+  if (navMenuToggle && menuPanel.querySelector('.nav-item-toggle')) {
+    navMenuToggle.style.display = ''
     navMenuToggle.addEventListener('click', function () {
       var collapse = !this.classList.toggle('is-active')
       find(menuPanel, '.nav-item > .nav-item-toggle').forEach(function (btn) {
@@ -54,15 +64,6 @@
     })
   }
 
-  find(menuPanel, '.nav-item-toggle').forEach(function (btn) {
-    btn.addEventListener('click', toggleActive.bind(btn.parentElement))
-    var nextElement = btn.nextElementSibling
-    if (nextElement && nextElement.classList.contains('nav-text')) {
-      nextElement.style.cursor = 'pointer'
-      nextElement.addEventListener('click', toggleActive.bind(btn.parentElement))
-    }
-  })
-
   nav.querySelector('[data-panel=explore] .context').addEventListener('click', function () {
     find(nav, '[data-panel]').forEach(function (panel) {
       // NOTE logic assumes there are only two panels

src/partials/nav-menu.hbs

@@ -1,7 +1,7 @@
 {{#with page.navigation}}
 <div class="nav-panel-menu is-active is-loading" data-panel="menu">
   <nav class="nav-menu">
-    <button class="nav-menu-toggle" aria-label="Toggle expand/collapse all"></button>
+    <button class="nav-menu-toggle" aria-label="Toggle expand/collapse all" style="display: none"></button>
     {{#with @root.page.componentVersion}}
     <h3 class="title"><a href="{{{relativize ./url}}}">{{./title}}</a></h3>
     {{/with}}