feat: auto hide empty article menu

1 files changed, 10 insertions, 4 deletions

diff --git a/_includes/sidebar/article-menu.html b/_includes/sidebar/article-menu.html
index c4286b1..ff984b6 100644
--- a/_includes/sidebar/article-menu.html
+++ b/_includes/sidebar/article-menu.html
@@ -13,9 +13,15 @@
 
 <script>
   function generateContent() {
-    var menu = document.querySelector(".post-menu .post-menu-content");
+    var menu = document.querySelector(".post-menu");
+    var menuContent =  menu.querySelector(".post-menu-content");
     var headings = document.querySelector(".post-content").querySelectorAll("h2, h3, h4, h5, h6");
 
+    // Hide menu when no headings
+    if (headings.length === 0) {
+      return menu.style.display = "none";
+    }
+
     // Generate post menu
     var menuHTML = '';
     for (var i = 0; i < headings.length; i++) {
@@ -25,14 +31,14 @@
         + '<a href="#h-' + h.getAttribute('id') + '">' + h.textContent + '</a></li>');
     }
 
-    menu.innerHTML = '<ul>' + menuHTML + '</ul>';
+    menuContent.innerHTML = '<ul>' + menuHTML + '</ul>';
 
     // The header element
     var header = document.querySelector('header.site-header');
 
     // Active the menu item
     window.addEventListener('scroll', function (event) {
-      var lastActive = menu.querySelector('.active');
+      var lastActive = menuContent.querySelector('.active');
       var changed = true;
       for (var i = headings.length - 1; i >= 0; i--) {
         var h = headings[i];
@@ -43,7 +49,7 @@
         var headerHeight = headerTop + headerHeight + 20;
         if (headingRect.top <= headerHeight) {
           var id = 'h-' + h.getAttribute('id');
-          var curActive = menu.querySelector('a[href="#' + id  + '"]');
+          var curActive = menuContent.querySelector('a[href="#' + id  + '"]');
           if (curActive) {
             curActive.classList.add('active');
           }