From 5ad1498afc47342ff43d56e37543dade97e9d1b6 Mon Sep 17 00:00:00 2001 From: Zaki <18zaki18@gmail.com> Date: Fri, 8 May 2026 19:59:56 +0100 Subject: [PATCH] add delete confirm, cancel shortcut + batch operations --- css/style.css | 61 +++++++ index.html | 47 ++++-- js/app.js | 445 +++++++++++++++++++++++++++++++++++++++++++------- vault.db | Bin 36864 -> 36864 bytes 4 files changed, 478 insertions(+), 75 deletions(-) diff --git a/css/style.css b/css/style.css index 80a3e38..74e9ed0 100644 --- a/css/style.css +++ b/css/style.css @@ -214,4 +214,65 @@ input:focus, select:focus { border-color:var(--accent); } #entriesContainer.grid-view { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); } .toolbar { flex-direction:column; } .folders-bar { flex-direction:column; align-items:stretch; } +} + +/* Floating action button */ +.fab { + position: fixed; bottom: 2rem; right: 2rem; + width: 56px; height: 56px; border-radius: 50%; + background: var(--accent); color: #fff; border: none; + font-size: 1.8rem; cursor: pointer; box-shadow: 0 8px 20px rgba(0,0,0,0.4); + display: flex; align-items: center; justify-content: center; + transition: 0.2s; z-index: 100; +} +.fab:hover { transform: scale(1.1); filter: brightness(1.1); } + +/* Generic modal overlay (if you don’t already have it) */ +.modal-overlay { + position: fixed; top: 0; left: 0; right: 0; bottom: 0; + background: rgba(0,0,0,0.7); display: none; + justify-content: center; align-items: center; z-index: 1001; +} +.modal-overlay.show { display: flex; } + +/* Modal box (used by both edit and add modals) */ +.modal-box { + background: var(--bg2); border-radius: 1.5rem; padding: 1.5rem; + min-width: 380px; max-width: 90%; +} +.modal-box h3 { margin-bottom: 1rem; color: var(--text); } +.modal-box label { color: var(--text2); font-size: 0.8rem; display: block; margin-bottom: 0.2rem; } +.modal-box input, .modal-box select { width: 100%; margin-bottom: 0.5rem; } +/* Batch select */ +.select-checkbox { + position: absolute; + top: 6px; + left: 6px; + z-index: 2; + accent-color: var(--accent); +} +.batch-actions { + position: fixed; + bottom: 20px; + left: 50%; + transform: translateX(-50%); + background: var(--bg2); + border: 1px solid var(--accent); + border-radius: 2rem; + padding: 0.5rem 1.5rem; + display: flex; + gap: 0.8rem; + align-items: center; + z-index: 1000; + box-shadow: 0 10px 25px rgba(0,0,0,0.5); + font-size: 0.85rem; + color: var(--text); +} +.batch-actions button { + font-size: 0.78rem; + padding: 0.35rem 0.8rem; +} +.selected-count { + font-weight: 600; + color: var(--accent); } \ No newline at end of file diff --git a/index.html b/index.html index bdba1e2..36e6df1 100644 --- a/index.html +++ b/index.html @@ -33,7 +33,29 @@ + + + +

πŸ” Vault XAMPP @@ -106,17 +128,17 @@

-
- - -
- - -
-
- - -
+ + + + + + + + + + +
@@ -126,6 +148,7 @@
+
@@ -149,7 +172,7 @@
-