04/18 fix web app responsive

2026-04-18 15:04:42 -04:00
parent 20d1d08b5e
commit 83c8d0eea5
3 changed files with 334 additions and 15 deletions
@@ -1,6 +1,24 @@
 {% extends "base.html" %} {% block title %}My Vault — PassKeeper{% endblock %}
 {% block body_class %}vault-page{% endblock %} {% block body %}
 <div class="app-layout">
+  <!-- ── Mobile top bar (phones only) ────────────────────────────── -->
+  <div class="mobile-topbar" id="mobile-topbar">
+    <button class="btn-mobile-menu" id="btn-mobile-menu" aria-label="Open menu">
+      ☰
+    </button>
+    <span class="mobile-logo">🔒 PassKeeper</span>
+    <button
+      class="btn-fab btn-fab-mobile"
+      id="btn-add-item-mobile"
+      title="Add item"
+    >
+      +
+    </button>
+  </div>
+
+  <!-- ── Sidebar backdrop (mobile) ───────────────────────────────── -->
+  <div class="sidebar-backdrop" id="sidebar-backdrop"></div>
+
  <!-- ── Sidebar ─────────────────────────────────────────────────── -->
  <aside class="sidebar" id="sidebar">
    <div class="sidebar-header">