From 7f3e489dc931516173b0a8dde17bbdf4eaed6c33 Mon Sep 17 00:00:00 2001
From: Siegfried Weber <mail@siegfriedweber.net>
Date: Fri, 11 Mar 2022 12:34:51 +0100
Subject: [PATCH 1/3] Enable navigation on mobile devices

---
 src/css/header.css              | 28 +++++++++++++++++++++++++++-
 src/js/05-mobile-navbar.js      |  7 +------
 src/partials/header-content.hbs |  4 ++--
 3 files changed, 30 insertions(+), 9 deletions(-)

diff --git a/src/css/header.css b/src/css/header.css
index a2aa089..6a45c79 100644
--- a/src/css/header.css
+++ b/src/css/header.css
@@ -267,8 +267,34 @@ body {
     display: none;
   }
 
+  .navbar-sub:not(.is-active) {
+    max-height: 0;
+    padding: 0;
+  }
+
   .navbar-sub {
-    display: none;
+    position: fixed;
+    top: var(--navbar-height);
+    width: 100%;
+    height: auto;
+    max-height: calc(100vh - var(--navbar-height));
+    overflow-y: scroll;
+    z-index: 4;
+    transition: max-height 0.2s ease, padding 0.2s ease;
+  }
+
+  .navbar-sub .container {
+      flex-direction: column;
+  }
+
+  .navbar-sub .drop-down-content {
+    display: inherit;
+    position: inherit;
+    top: inherit;
+    left: inherit;
+    padding-top: 7px;
+    padding-bottom: 0;
+    box-shadow: inherit;
   }
 
   .navbar-brand .navbar-item {
diff --git a/src/js/05-mobile-navbar.js b/src/js/05-mobile-navbar.js
index 892d0e7..e957441 100644
--- a/src/js/05-mobile-navbar.js
+++ b/src/js/05-mobile-navbar.js
@@ -10,11 +10,6 @@
     document.documentElement.classList.toggle('is-clipped--navbar')
     this.classList.toggle('is-active')
     var menu = document.getElementById(this.dataset.target)
-    if (menu.classList.toggle('is-active')) {
-      menu.style.maxHeight = ''
-      var expectedMaxHeight = window.innerHeight - Math.round(menu.getBoundingClientRect().top)
-      var actualMaxHeight = parseInt(window.getComputedStyle(menu).maxHeight, 10)
-      if (actualMaxHeight !== expectedMaxHeight) menu.style.maxHeight = expectedMaxHeight + 'px'
-    }
+    menu.classList.toggle('is-active')
   }
 })()
diff --git a/src/partials/header-content.hbs b/src/partials/header-content.hbs
index aa377d9..a850a97 100644
--- a/src/partials/header-content.hbs
+++ b/src/partials/header-content.hbs
@@ -11,7 +11,7 @@
         </div>
       </div>
       {{/if}}
-      <button class="navbar-burger" data-target="topbar-nav">
+      <button class="navbar-burger" data-target="navbar-sub">
         <span></span>
         <span></span>
         <span></span>
@@ -22,7 +22,7 @@
       </div>
       </div>
     </nav>
-    <nav class="navbar-sub">
+    <nav id="navbar-sub" class="navbar-sub">
       <div class="container">
         <a class="navbar-sub-item" href="{{{ relativize "/home/index.html" }}}">Overview</a>
         <a class="navbar-sub-item" href="{{{ relativize "/home/index.html" }}}">Architecture</a>

From 7ea5a9bc7e2b34c89f7b666b62591c92115b2648 Mon Sep 17 00:00:00 2001
From: Siegfried Weber <mail@siegfriedweber.net>
Date: Mon, 21 Mar 2022 08:12:16 +0100
Subject: [PATCH 2/3] Fix indentation

---
 src/css/header.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/css/header.css b/src/css/header.css
index 6a45c79..2044138 100644
--- a/src/css/header.css
+++ b/src/css/header.css
@@ -284,7 +284,7 @@ body {
   }
 
   .navbar-sub .container {
-      flex-direction: column;
+    flex-direction: column;
   }
 
   .navbar-sub .drop-down-content {

From 84aa092f657968b439484fa03926a39078ec2388 Mon Sep 17 00:00:00 2001
From: Siegfried Weber <mail@siegfriedweber.net>
Date: Mon, 21 Mar 2022 09:51:33 +0100
Subject: [PATCH 3/3] Skip initialization of the navigation container on the
 landing page

---
 src/js/01-nav.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/js/01-nav.js b/src/js/01-nav.js
index d116c9d..61a2f8c 100644
--- a/src/js/01-nav.js
+++ b/src/js/01-nav.js
@@ -4,6 +4,7 @@
   var SECT_CLASS_RX = /^sect(\d)$/
 
   var navContainer = document.querySelector('.nav-container')
+  if (!navContainer) return
   var navToggle = document.querySelector('.nav-toggle')
 
   navToggle.addEventListener('click', showNav)