feat(settings): keep backup pwd on disable, dedicated pwd button, tab icons

Auto-backup no longer wipes the stored password when disabled, so
re-enabling reuses it silently. A dedicated "Set/Change backup password"
button (mirrors sync) owns the password, with a warning status when
unset. Corrected the stale hint that claimed the backup pwd was derived
from the master password. Added icons to each settings tab.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
r-zakarya
2026-07-10 16:53:45 +01:00
parent 064ad14156
commit 45ba47f772
5 changed files with 44 additions and 20 deletions
+12 -8
View File
@@ -415,11 +415,11 @@
</div>
<div class="settings-main">
<div class="settings-tabs" id="settingsTabs">
<button class="settings-tab is-active" data-tab="general">General</button>
<button class="settings-tab" data-tab="security">Security</button>
<button class="settings-tab" data-tab="autofill">Autofill</button>
<button class="settings-tab" data-tab="account">Account</button>
<button class="settings-tab" data-tab="sync">Sync &amp; Backup</button>
<button class="settings-tab is-active" data-tab="general"><svg><use href="#i-settings"/></svg>General</button>
<button class="settings-tab" data-tab="security"><svg><use href="#i-shield"/></svg>Security</button>
<button class="settings-tab" data-tab="autofill"><svg><use href="#i-key"/></svg>Autofill</button>
<button class="settings-tab" data-tab="account"><svg><use href="#i-user"/></svg>Account</button>
<button class="settings-tab" data-tab="sync"><svg><use href="#i-rotate-ccw"/></svg>Sync &amp; Backup</button>
</div>
<div class="slideover-body" id="settingsBody">
<div class="slideover-field">
@@ -769,10 +769,14 @@
</label>
</div>
<p style="font-size:11px;color:var(--text-faint);margin:0 0 8px;line-height:1.4">
Backups are encrypted with a password derived from your
master password (so restore needs the master at the
time of backup). Filename pattern: <code>vault-autobackup-YYYYMMDD-HHmmss.json</code>.
Backups are encrypted with a password you choose
(independent of your master password — you'll need it
to restore). Filename pattern: <code>vault-autobackup-YYYYMMDD-HHmmss.json</code>.
</p>
<div style="display:flex;gap:8px;align-items:center;margin-bottom:8px">
<button class="btn btn-ghost btn-sm" id="autoBackupSetPwdBtn">Set backup password</button>
<span id="autoBackupPwdStatus" style="font-size:11px;display:inline-flex;align-items:center;gap:4px"></span>
</div>
<div style="display:flex;gap:6px;flex-wrap:wrap;align-items:center">
<button class="btn btn-ghost btn-sm" id="autoBackupNowBtn">
<svg><use href="#i-log-out"/></svg> Backup now