25f4411dbf16

pin wordmark at same spot across onboarding screens and move create-vault back button to right corner, bump 4.10.10

time
2026-08-20 05:42 UTC · 2 months ago
machine
koh2
agent
qwen3.8-max
session
onboarding layout consistency
parent
89d46b400df2
6 files manifest.firefox.json+1 −1manifest.json+1 −1package.json+1 −1src/popup/styles/popup.css+9 −3src/popup/views/Lock.tsx+6 −6src/popup/views/contracts.test.tsx+21 −0
manifest.firefox.json+1 −1
@@ -1,7 +1,7 @@11 {22   "manifest_version": 3,33   "name": "Peach Password Manager",4-  "version": "4.10.9",4+  "version": "4.10.10",55   "description": "Zero-knowledge password manager",66   "browser_specific_settings": {77     "gecko": {

view file

manifest.json+1 −1
@@ -2,7 +2,7 @@22   "manifest_version": 3,33   "minimum_chrome_version": "116",44   "name": "Peach Password Manager",5-  "version": "4.10.9",5+  "version": "4.10.10",66   "description": "Zero-knowledge password manager",77   "action": {88     "default_popup": "src/popup/index.html",

view file

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

view file

src/popup/styles/popup.css+9 −3
@@ -3926,8 +3926,11 @@39263926 /* ── Restore tab view ─────────────────────────────────────────────────────39273927    Tab-based restore screen replacing the old three-card picker. */39283928 3929-.peach-restore-tabview {3929+.peach-screen.peach-restore-tabview {39303930   overflow: hidden;3931+  /* Wordmark must land on the same pixel as on the onboarding cards and3932+     create-vault screens (16px top/left), not the vault-stage 20/18. */3933+  padding: 16px 16px 18px;39313934 }39323935 39333936 .peach-restore-tabcard {@@ -7617,7 +7620,7 @@76177620   display: flex;76187621   flex-direction: column;76197622   gap: 12px;7620-  padding: 14px 16px 12px;7623+  padding: 16px 16px 12px;76217624   overflow: hidden;76227625 }76237626 @@ -7627,11 +7630,14 @@76277630   content: none;76287631 }76297632 7633+/* Wordmark sits in the exact same spot as on the onboarding cards; the7634+   back button takes the right side so the wordmark never shifts. */76307635 .peach-newvault-header {76317636   position: relative;76327637   z-index: 2;76337638   display: flex;76347639   align-items: center;7640+  justify-content: space-between;76357641   gap: 10px;76367642   margin-bottom: 2px;76377643 }@@ -7660,7 +7666,7 @@76607666 .peach-newvault-mark {76617667   position: absolute;76627668   right: -12px;7663-  top: 6px;7669+  top: 44px;76647670   width: 110px;76657671   height: 110px;76667672   pointer-events: none;

view file

src/popup/views/Lock.tsx+6 −6
@@ -462,6 +462,12 @@462462           data-motion-phase="enter"463463         >464464           <header class="peach-screen-header peach-newvault-header">465+            <div class="peach-wordmark-stack">466+              <PeachWordmark class="peach-wordmark-wrap" />467+              <Show when={props.isPro}>468+                <span class="peach-pro-mini-badge">pro</span>469+              </Show>470+            </div>465471             <Show when={props.onBackToOnboarding}>466472               <button467473                 class="peach-newvault-back"@@ -475,12 +481,6 @@475481                 back476482               </button>477483             </Show>478-            <div class="peach-wordmark-stack">479-              <PeachWordmark class="peach-wordmark-wrap" />480-              <Show when={props.isPro}>481-                <span class="peach-pro-mini-badge">pro</span>482-              </Show>483-            </div>484484           </header>485485 486486           <div class="peach-newvault-mark" aria-hidden="true">

view file

src/popup/views/contracts.test.tsx+21 −0
@@ -371,6 +371,27 @@371371     expect(createButton.disabled).toBe(true);372372   });373373 374+  it("Lock create-vault header pins the wordmark left with back on the right", async () => {375+    const container = mount(376+      <LockView377+        hasVault={false}378+        ready={true}379+        onUnlock={vi.fn()}380+        onBackToOnboarding={() => {}}381+      />382+    );383+    const header = container.querySelector(".peach-newvault-header") as HTMLElement;384+    const wordmark = header.querySelector(".peach-wordmark-stack");385+    const back = header.querySelector(".peach-newvault-back");386+    expect(wordmark).toBeTruthy();387+    expect(back).toBeTruthy();388+    // Wordmark first so it never shifts between onboarding screens; back389+    // takes the opposite corner instead of displacing it.390+    expect(header.firstElementChild).toBe(wordmark);391+    expect(header.lastElementChild).toBe(back);392+    await flushView();393+  });394+374395   it("Lock sends CREATE_VAULT when the onboarding passphrase is strong enough", async () => {375396     // Sequence: CREATE_VAULT → show recovery words → GET_RECOVERY_WORDS → user confirms → onUnlock376397     sendMessageMock.mockImplementation(

view file