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
↓ peach-browser-25f4411d.tar.gzatlas at this save
files changed6 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 −0manifest.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": {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",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",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;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">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(