From c13b1865c5620c76b06be0f86a97ab3fba7c0cbf Mon Sep 17 00:00:00 2001 From: Martin Dvorak Date: Mon, 12 Oct 2026 11:45:56 +0000 Subject: [PATCH] Sidebar: give the collapse arrow one home in the rail's top-right MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit On desktop the collapse/expand control swapped places between states: in the brand row when expanded, but a nav row in the middle of the icon column when collapsed — it read as the arrow jumping around. - One button for both directions, anchored to the rail's top-right corner in both states (measured 23px from the rail's right edge either way; the padding accounts for the rest). - Collapsed, the brand mark leads the icon column (it cannot share the brand row with the arrow: the 60px panel has ~40px of content width). - The expanded state is unchanged (logo + name + DEV badge, arrow top right). README: note in decision 22. SW -> freezmo-v41. --- README.md | 4 +- components/Sidebar.tsx | 90 ++++++++++++++++++++---------------------- public/sw.js | 2 +- 3 files changed, 47 insertions(+), 49 deletions(-) diff --git a/README.md b/README.md index fead6c4..49b2e2a 100644 --- a/README.md +++ b/README.md @@ -1054,7 +1054,9 @@ Things I chose while building, with the reasoning: rounded glass panel inset from the viewport edges, so the ice scene shows around it; deck cards are 24px-radius glass panels with a secondary Study CTA and quiet metadata. Headings are semibold with tighter tracking. Nested glass (chips, inputs) is more opaque but never adds a - second blur layer. + second blur layer. The collapse/expand arrow keeps one home — the rail's top-right corner in + both states (it used to become a nav row in the middle of the icon column when collapsed, + which read as the control jumping around); collapsed, the brand mark leads the icon column. 23. **One fixed ice scene instead of per-page blobs.** The decorative background used to be rendered inside the content column, so on wide screens it was clipped into a visible hard edge. It now lives in a single `position: fixed` layer (`.ice-scene`, `z-index: -1`, pointer-events diff --git a/components/Sidebar.tsx b/components/Sidebar.tsx index 787ca9f..9263d8a 100644 --- a/components/Sidebar.tsx +++ b/components/Sidebar.tsx @@ -90,47 +90,57 @@ function NavContent({ collapsed = false }: { collapsed?: boolean }) { ); + const brandMark = ( + // eslint-disable-next-line @next/next/no-img-element -- static app icon, no optimisation needed + + ); + return (
{/* brand ---------------------------------------------------------- */} -
- - {/* eslint-disable-next-line @next/next/no-img-element -- static app icon, no optimisation needed */} - - {!collapsed ? ( - <> - Freezmo - {IS_DEV_INSTANCE ? ( - - DEV - - ) : null} - - ) : null} - +
{!collapsed ? ( - + {brandMark} + Freezmo + {IS_DEV_INSTANCE ? ( + + DEV + + ) : null} + ) : null} + {/* One home for the arrow: the rail's top-right corner in both states. + It used to swap between the brand row and the middle of the icon + column, which read as the control jumping around. */} +
+ {/* collapsed: the brand mark leads the icon column ------------------ */} + {collapsed ? ( + + {brandMark} + + ) : null} + {/* new deck: a quiet row, not a competing primary button ---------- */} {t("chat.nav")} : null} - {/* The expand control sits outside the swappable section, so it stays - reachable when the chat list replaces the deck navigation. */} - {collapsed ? ( - - ) : null} - {/* On the Chat route the chat list takes the deck navigation's place. */} {onChat ? : null} diff --git a/public/sw.js b/public/sw.js index 02404c3..481f390 100644 --- a/public/sw.js +++ b/public/sw.js @@ -9,7 +9,7 @@ * * Bumping CACHE_VERSION is how a new deploy invalidates old assets. */ -const CACHE_VERSION = "freezmo-v40"; +const CACHE_VERSION = "freezmo-v41"; const SHELL_CACHE = `${CACHE_VERSION}-shell`; const ASSET_CACHE = `${CACHE_VERSION}-assets`;