Update sidebar.

It now is an overlay on mobile

assets/page/actions.js

@@ -124,28 +124,3 @@ function deletePage() {
     });
 }
 
-document.addEventListener('DOMContentLoaded', function () {
-    var panel = document.querySelector('.actions');
-    if (!panel) return;
-
-    var toggle = document.createElement('button');
-    toggle.type = 'button';
-    toggle.className = 'panel-toggle';
-    toggle.textContent = 'Actions';
-    toggle.setAttribute('aria-expanded', 'false');
-    toggle.addEventListener('click', function () {
-        var open = panel.classList.toggle('is-open');
-        toggle.setAttribute('aria-expanded', open ? 'true' : 'false');
-    });
-
-    var main = document.querySelector('main');
-    if (!main) return;
-    // Insert at the top of main's parent (right after the header) so the
-    // ACTIONS toggle sits above any toggles other panels may have added.
-    var header = document.querySelector('header');
-    var anchor = header ? header.nextSibling : main.parentNode.firstChild;
-    main.parentNode.insertBefore(toggle, anchor);
-    if (window.matchMedia('(max-width: 1100px)').matches) {
-        main.parentNode.insertBefore(panel, toggle.nextSibling);
-    }
-});

assets/page/main.html

@@ -32,6 +32,7 @@
 {{if .Content}}
 <script src="/_/page/sections.js"></script>
 {{end}}
+<script src="/_/page/sidebar-fab.js"></script>
 {{end}}
 
 {{define "sidebar"}}{{if .CanEdit}}<nav class="actions">

assets/page/sidebar-fab.js

@@ -0,0 +1,23 @@
+document.addEventListener("DOMContentLoaded", function () {
+  var aside = document.querySelector("aside.sidebar");
+  if (!aside || !aside.children.length) return;
+
+  var fab = document.createElement("button");
+  fab.type = "button";
+  fab.className = "btn btn-fab fab";
+  fab.title = "Menu";
+  fab.setAttribute("aria-label", "Menu");
+  fab.setAttribute("aria-expanded", "false");
+  fab.textContent = "≡";
+  fab.addEventListener("click", function () {
+    var open = aside.classList.toggle("is-open");
+    fab.setAttribute("aria-expanded", open ? "true" : "false");
+  });
+  aside.addEventListener("click", function (e) {
+    if (e.target.tagName === "A") {
+      aside.classList.remove("is-open");
+      fab.setAttribute("aria-expanded", "false");
+    }
+  });
+  document.body.appendChild(fab);
+});

assets/page/toc.js

@@ -30,23 +30,4 @@ document.addEventListener("DOMContentLoaded", function () {
 
   var rail = document.querySelector("aside.sidebar");
   rail.appendChild(nav);
-
-  var fab = document.createElement("button");
-  fab.type = "button";
-  fab.className = "btn btn-fab fab";
-  fab.title = "Contents";
-  fab.setAttribute("aria-label", "Contents");
-  fab.setAttribute("aria-expanded", "false");
-  fab.textContent = "≡";
-  fab.addEventListener("click", function () {
-    var open = nav.classList.toggle("is-open");
-    fab.setAttribute("aria-expanded", open ? "true" : "false");
-  });
-  nav.addEventListener("click", function (e) {
-    if (e.target.tagName === "A") {
-      nav.classList.remove("is-open");
-      fab.setAttribute("aria-expanded", "false");
-    }
-  });
-  document.body.appendChild(fab);
 });