ad2ecd73807a

fix: Use full Settings focused-card height (v3.6.45)

time
2026-05-19 22:19 UTC · 5 months ago
machine
koh2
parent
c89a6e60f3e1
6 files manifest.firefox.json+1 −1manifest.json+1 −1package-lock.json+2 −2package.json+1 −1src/popup/components/settings/StackDeck.tsx+24 −4src/popup/styles/settings-stack.css+0 −39
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",5-  "version": "3.6.44",5+  "version": "3.6.45",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",4-  "version": "3.6.44",4+  "version": "3.6.45",55   "description": "Zero-knowledge password manager",66   "action": {77     "default_popup": "src/popup/index.html",

view file

package-lock.json+2 −2
@@ -1,12 +1,12 @@11 {22   "name": "peach",3-  "version": "3.6.44",3+  "version": "3.6.45",44   "lockfileVersion": 3,55   "requires": true,66   "packages": {77     "": {88       "name": "peach",9-      "version": "3.6.44",9+      "version": "3.6.45",1010       "dependencies": {1111         "@bokuweb/zstd-wasm": "^0.0.27",1212         "@stablelib/blake2s": "^2.0.1",

view file

package.json+1 −1
@@ -1,6 +1,6 @@11 {22   "name": "peach",3-  "version": "3.6.44",3+  "version": "3.6.45",44   "description": "Zero-knowledge password manager",55   "type": "module",66   "scripts": {

view file

src/popup/components/settings/StackDeck.tsx+24 −4
@@ -13,13 +13,15 @@1313 }1414 1515 const EXPANDED_H = 258;16-const FOCUS_H = 420;16+const DEFAULT_FOCUS_H = 462;1717 const TAB_H = 46;1818 const TAB_OVERLAP = 14;1919 2020 export function StackDeck(props: StackDeckProps) {2121   const [deckOpen, setDeckOpen] = createSignal(true);22+  const [focusHeight, setFocusHeight] = createSignal(DEFAULT_FOCUS_H);2223   let focusedAt = 0;24+  let deckEl: HTMLDivElement | undefined;2325 2426   function handleBack() {2527     if (!deckOpen()) {@@ -32,7 +34,24 @@3234   onMount(() => {3335     const listener = () => handleBack();3436     window.addEventListener("peach:settings-back", listener);35-    onCleanup(() => window.removeEventListener("peach:settings-back", listener));37+38+    const updateFocusHeight = () => {39+      if (!deckEl) return;40+      setFocusHeight(Math.round(deckEl.getBoundingClientRect().height));41+    };42+    updateFocusHeight();43+    const observer =44+      typeof ResizeObserver === "undefined"45+        ? undefined46+        : new ResizeObserver(updateFocusHeight);47+    if (deckEl) observer?.observe(deckEl);48+    if (!observer) window.addEventListener("resize", updateFocusHeight);49+50+    onCleanup(() => {51+      window.removeEventListener("peach:settings-back", listener);52+      observer?.disconnect();53+      if (!observer) window.removeEventListener("resize", updateFocusHeight);54+    });3655   });3756 3857   const activeIndex = createMemo(() => {@@ -61,6 +80,7 @@6180       </div>6281 6382       <div83+        ref={(el) => { deckEl = el; }}6484         class={`stk-deck ${deckOpen() ? "is-open" : "is-focused"}`}6585         onWheel={(e) => {6686           const cardEl = (e.target as HTMLElement).closest<HTMLElement>("[data-settings-card-id]");@@ -90,7 +110,7 @@90110             });91111             const top = () => {92112               if (active()) return 0;93-              if (!deckOpen()) return FOCUS_H + 44 + distance() * 8;113+              if (!deckOpen()) return focusHeight() + 44 + distance() * 8;94114               return EXPANDED_H - TAB_OVERLAP + distance() * (TAB_H - TAB_OVERLAP);95115             };96116             const zIndex = () => (active() ? 99 : 50 - distance());@@ -103,12 +123,12 @@103123                 concealed={concealed()}104124                 top={top()}105125                 zIndex={zIndex()}106-                height={active() ? (deckOpen() ? EXPANDED_H : FOCUS_H) : TAB_H + 4}107126                 onClick={() => {108127                   if (active()) return;109128                   props.onActiveChange(card.id);110129                   setDeckOpen(false);111130                 }}131+                height={active() ? (deckOpen() ? EXPANDED_H : focusHeight()) : TAB_H + 4}112132               >113133                 {props.bodies[card.id]}114134               </StackCard>

view file

src/popup/styles/settings-stack.css+0 −39
@@ -217,45 +217,6 @@217217   outline-offset: 2px;218218 }219219 220-.stk-tray-handle {221-  position: absolute;222-  left: 50%;223-  bottom: 8px;224-  z-index: 120;225-  transform: translateX(-50%);226-  height: 30px;227-  min-width: 112px;228-  display: inline-flex;229-  align-items: center;230-  justify-content: center;231-  border: 1px solid color-mix(in srgb, var(--peach-accent) 32%, transparent);232-  border-radius: 999px;233-  background:234-    linear-gradient(180deg, color-mix(in srgb, var(--peach-bg) 88%, transparent), color-mix(in srgb, var(--peach-bg) 72%, transparent)),235-    color-mix(in srgb, var(--peach-accent) 10%, transparent);236-  color: var(--peach-t1);237-  font-family: var(--font-mono);238-  font-size: 9px;239-  letter-spacing: 0.2em;240-  text-transform: uppercase;241-  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22);242-  cursor: pointer;243-}244-245-.stk-tray-handle::before {246-  content: "";247-  position: absolute;248-  top: 5px;249-  width: 26px;250-  height: 2px;251-  border-radius: 999px;252-  background: color-mix(in srgb, currentColor 45%, transparent);253-}254-255-.stk-tray-handle span {256-  transform: translateY(4px);257-}258-259220 .stk-row {260221   display: flex;261222   align-items: center;

view file