reorganize header menu

assets/page/contents.js

@@ -0,0 +1,15 @@
+document.addEventListener("DOMContentLoaded", function () {
+  var aside = document.querySelector("aside.sidebar");
+  var specials = document.querySelector(".actions-special");
+  if (!aside || !aside.children.length || !specials) return;
+
+  var item = document.createElement("button");
+  item.type = "button";
+  item.className = "btn btn-block";
+  item.title = "Contents";
+  item.textContent = "CONTENTS";
+  item.addEventListener("click", function () {
+    if (typeof openOverlay === "function") openOverlay(aside);
+  });
+  specials.appendChild(item);
+});

assets/page/header-actions.js

@@ -1,16 +0,0 @@
-// Wires the header-right [ACTIONS] dropdown. The buttons inside keep calling
-// the existing page/actions.js handlers (newPage / movePage / deletePage) and
-// the ?edit link, so the N/E/M keyboard shortcuts continue to work whether or
-// not the menu is open. Toggling reuses the generic wireDropdown mechanism
-// (global-shortcuts.js), which also handles outside-click / Escape close.
-(function () {
-    var trigger = document.querySelector('[data-action="page-actions"]');
-    if (!trigger || typeof wireDropdown !== 'function') return;
-    wireDropdown(trigger);
-    var menu = trigger.parentElement.querySelector('.dropdown-menu');
-    if (!menu) return;
-    // Keep aria-expanded in sync with the menu's open state.
-    trigger.addEventListener('click', function () {
-        trigger.setAttribute('aria-expanded', menu.classList.contains('is-open') ? 'true' : 'false');
-    });
-})();

assets/page/main.html

@@ -1,21 +1,13 @@
 {{define "headScripts"}}<script src="/_/page/actions.js"></script>{{end}}
 
 {{define "headerActions"}}{{if .CanEdit}}
-<span class="dropdown">
-    <button type="button" class="btn" data-action="page-actions" aria-haspopup="true" aria-expanded="false" title="Page actions">ACTIONS</button>
-    <div class="dropdown-menu align-right">
-        <button class="btn btn-block" onclick="newPage()" title="New page (N)">NEW PAGE</button>
-        <a class="btn btn-block" href="?edit" title="Edit page (E)">EDIT PAGE</a>
-        <button class="btn btn-block" data-companion-reveal hidden title="Reveal in file manager">REVEAL ON CLIENT</button>
-        {{if not .IsRoot}}
-        <button class="btn btn-block" onclick="movePage()" title="Move page (M)">MOVE PAGE</button>
-        {{end}}
-        {{if not .IsRoot}}
-        <button class="btn btn-block danger" onclick="deletePage()" title="Delete page">DELETE PAGE</button>
-        {{end}}
-    </div>
-</span>
-<script src="/_/page/header-actions.js"></script>
+<button class="btn btn-block" onclick="newPage()" title="New page (N)">NEW</button>
+<a class="btn btn-block" href="?edit" title="Edit page (E)">EDIT</a>
+<button class="btn btn-block" data-companion-reveal hidden title="Reveal in file manager">REVEAL</button>
+{{if not .IsRoot}}
+<button class="btn btn-block" onclick="movePage()" title="Move page (M)">MOVE</button>
+<button class="btn btn-block danger" onclick="deletePage()" title="Delete page">DELETE</button>
+{{end}}
 {{end}}{{end}}
 
 {{define "content"}}
@@ -63,7 +55,7 @@
 {{if .Content}}
 <script src="/_/page/sections.js"></script>
 {{end}}
-<script src="/_/page/sidebar-fab.js"></script>
+<script src="/_/page/contents.js"></script>
 {{end}}
 
 {{define "aside"}}{{if .SidebarWidget}}<aside class="sidebar">{{.SidebarWidget}}</aside>{{end}}{{end}}

assets/page/sidebar-fab.js

@@ -1,15 +0,0 @@
-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-rail";
-  fab.title = "Contents";
-  fab.setAttribute("aria-label", "Contents");
-  fab.textContent = "≡";
-  fab.addEventListener("click", function () {
-    if (typeof openOverlay === "function") openOverlay(aside);
-  });
-  document.body.appendChild(fab);
-});