ef6f00072940

fix: surface restore options on create-vault screen — relocate restore from clipped page footer into the card under the create CTA, tighten create-vault spacing so restore links + full recovery warning fit the 320x520 popup without clipping; shorten hint/warning copy; bump 4.0.1→4.0.2 (v4.0.2)

time
2026-06-14 03:10 UTC · 4 months ago
machine
koh2
agent
claude-opus-4-8
session
restore flow onboarding visibility
parent
9e5693046d73
5 files manifest.firefox.json+1 −1manifest.json+1 −1package.json+1 −1src/popup/styles/popup.css+19 −9src/popup/views/Lock.tsx+24 −20
manifest.firefox.json+1 −1
@@ -2,7 +2,7 @@22   "_comment_audio_capture": "Firefox does not honor the Chrome 'audioCapture' optional_permission — getUserMedia in WebExtensions is gated solely by the runtime permission prompt. Microphone access for chirp pairing works from the popup under the existing '<all_urls>' host permission; no manifest entry is required or accepted here.",33   "manifest_version": 3,44   "name": "Peach Password Manager",5-  "version": "4.0.1",5+  "version": "4.0.2",66   "description": "Zero-knowledge password manager",77   "browser_specific_settings": {88     "gecko": {

view file

manifest.json+1 −1
@@ -1,7 +1,7 @@11 {22   "manifest_version": 3,33   "name": "Peach Password Manager",4-  "version": "4.0.1",4+  "version": "4.0.2",55   "description": "Zero-knowledge password manager",66   "action": {77     "default_popup": "src/popup/index.html",

view file

package.json+1 −1
@@ -1,6 +1,6 @@11 {22   "name": "peach",3-  "version": "4.0.1",3+  "version": "4.0.2",44   "description": "Zero-knowledge password manager",55   "license": "GPL-3.0-only",66   "type": "module",

view file

src/popup/styles/popup.css+19 −9
@@ -7036,12 +7036,17 @@70367036 70377037 /* ─── New vault screen — matched to onboarding card language ─────────── */70387038 7039-.peach-newvault {7039+/* Two classes so this beats the shared .peach-screen.lock-screen--vault-stage7040+   rule (same element) without loosening the unlock/restore screens. The7041+   create-vault screen is the only vault-stage view tall enough to overflow7042+   the 520px popup, so its spacing is tuned to fit header → card → restore →7043+   recovery warning with nothing clipped. */7044+.peach-screen.peach-newvault {70407045   position: relative;70417046   display: flex;70427047   flex-direction: column;70437048   gap: 12px;7044-  padding: 16px 16px 18px;7049+  padding: 14px 16px 12px;70457050   overflow: hidden;70467051 }70477052 @@ -7108,8 +7113,8 @@71087113   z-index: 1;71097114   display: flex;71107115   flex-direction: column;7111-  gap: 12px;7112-  padding: 22px 20px 18px;7116+  gap: 8px;7117+  padding: 16px 20px 14px;71137118   border-radius: 16px;71147119   border: 1px solid var(--peach-t3);71157120   background:@@ -7181,11 +7186,11 @@71817186   display: flex;71827187   align-items: flex-start;71837188   gap: 8px;7184-  margin: 4px 0 0;7185-  padding-top: 10px;7189+  margin: 2px 0 0;7190+  padding-top: 8px;71867191   border-top: 1px dashed var(--peach-t3);71877192   font-size: 0.75rem;7188-  line-height: 1.5;7193+  line-height: 1.45;71897194   color: var(--peach-t1);71907195 }71917196 @@ -7196,13 +7201,18 @@71967201   flex: 0 0 auto;71977202 }71987203 7199-.peach-newvault-footer {7204+/* Restore options sit inside the card, directly under "create vault", so7205+   they are always reachable without scrolling. The top divider mirrors the7206+   warning's so the choice reads as a deliberate fork, not a footnote. */7207+.peach-newvault-restore {72007208   position: relative;72017209   z-index: 1;72027210   display: flex;72037211   flex-direction: column;72047212   gap: 4px;7205-  padding: 4px 4px 0;7213+  margin-top: 4px;7214+  padding-top: 10px;7215+  border-top: 1px dashed var(--peach-t3);72067216 }72077217 72087218 /* Settings body — warm accent gradient gives the glass something to blur against */

view file

src/popup/views/Lock.tsx+24 −20
@@ -465,7 +465,7 @@465465                 when={password().length > 0 && passwordStrength() !== null}466466                 fallback={467467                   <p class="peach-newvault-hint">468-                    Use at least 12 characters. Peach will only create the vault when the passwords match and the strength check passes.468+                    At least 12 characters. The vault is created once both fields match and pass the strength check.469469                   </p>470470                 }471471               >@@ -515,30 +515,34 @@515515               </Show>516516             </button>517517 518-            <p class="peach-newvault-warning">519-              <span class="peach-newvault-warning-icon" aria-hidden="true">⚠</span>520-              <span>Save your 12 recovery words right after you create the vault — they're the only way in if you forget your password.</span>521-            </p>522-          </div>523-524-          <div class="peach-newvault-footer">525-            <p class="peach-hint">Already have a backup?</p>526-            <button527-              class="peach-lock-restore-link"528-              onClick={() => void openRestore("restore")}529-              disabled={!props.ready}530-            >531-              › restore from backup532-            </button>533-            <Show when={props.onOpenCodexRestore}>518+            {/* Restore lives directly under the primary CTA, not in a page519+                footer — the 520px popup clipped a bottom footer below the520+                fold, so a fresh install looked like "new vault" was the only521+                path. These must stay on-screen without scrolling. */}522+            <div class="peach-newvault-restore">523+              <p class="peach-hint">Already have a backup?</p>534524               <button535525                 class="peach-lock-restore-link"536-                onClick={() => props.onOpenCodexRestore?.()}526+                onClick={() => void openRestore("restore")}537527                 disabled={!props.ready}538528               >539-                › restore from peach codex529+                › restore from backup540530               </button>541-            </Show>531+              <Show when={props.onOpenCodexRestore}>532+                <button533+                  class="peach-lock-restore-link"534+                  onClick={() => props.onOpenCodexRestore?.()}535+                  disabled={!props.ready}536+                >537+                  › restore from peach codex538+                </button>539+              </Show>540+            </div>541+542+            <p class="peach-newvault-warning">543+              <span class="peach-newvault-warning-icon" aria-hidden="true">⚠</span>544+              <span>Save your 12 recovery words after creating — they're the only way back in if you forget your password.</span>545+            </p>542546           </div>543547         </section>544548       </Match>

view file