feat: menu layout

webui/html/app.js

@@ -856,7 +856,6 @@ function setupEvents() {
   document.getElementById("copy-btn").onclick = startCopySelected;
   document.getElementById("move-btn").onclick = startMoveSelected;
   document.getElementById("mkdir-btn").onclick = createFolderForActivePane;
-  document.getElementById("add-bookmark-btn").onclick = addBookmark;
 
   const wildcard = wildcardPopupElements();
   wildcard.cancelButton.onclick = closeWildcardPopup;

webui/html/index.html

@@ -60,14 +60,15 @@
     </main>
 
     <section id="footer-bar">
-      <div class="toolbar compact-toolbar">
-        <div class="pathline compact-line">A:<code id="active-pane-label">left</code></div>
-        <button id="rename-btn" disabled>Rename</button>
-        <button id="delete-btn" disabled>Delete</button>
-        <button id="copy-btn" disabled>Copy</button>
-        <button id="move-btn" disabled>Move</button>
-        <button id="mkdir-btn">Mkdir</button>
-        <button id="add-bookmark-btn">Add bookmark</button>
+      <div id="function-bar-meta" class="pathline compact-line">Active:<code id="active-pane-label">left</code></div>
+      <div id="function-bar" class="toolbar compact-toolbar">
+        <button id="view-btn" type="button" disabled>View</button>
+        <button id="edit-btn" type="button" disabled>Edit</button>
+        <button id="copy-btn" type="button" disabled>Copy</button>
+        <button id="move-btn" type="button" disabled>Move</button>
+        <button id="rename-btn" type="button" disabled>Rename</button>
+        <button id="mkdir-btn" type="button">MKdir</button>
+        <button id="delete-btn" type="button" disabled>Delete</button>
       </div>
       <div id="actions-error" class="error"></div>
     </section>

webui/html/style.css

@@ -295,7 +295,29 @@ button:disabled {
 #footer-bar {
   border-top: 1px solid var(--border);
   background: var(--panel);
-  padding: 4px 10px 2px 10px;
+  padding: 4px 10px 3px 10px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 3px;
+}
+
+#function-bar-meta {
+  margin-bottom: 0;
+  justify-content: center;
+}
+
+#function-bar {
+  margin-bottom: 0;
+  justify-content: center;
+  gap: 5px;
+  width: 100%;
+  max-width: 760px;
+}
+
+#function-bar button {
+  min-width: 72px;
+  padding: 3px 8px;
 }
 
 .popup-overlay {