From d26fd94fe3e2e51c97adc031cee36cadc90b4883 Mon Sep 17 00:00:00 2001
From: thePR0M3TH3AN <53631862+PR0M3TH3AN@users.noreply.github.com>
Date: Tue, 2 Jun 2026 15:03:20 -0400
Subject: [PATCH] pin Back-to-Pages + Back-to-Deck bars to the viewport
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Both edit bars used position: absolute, which made them children
of the scrolling #previewShell — panning or zooming the canvas
dragged the bars off-screen. Switching to position: fixed pins
them to the viewport so they stay put at top-center regardless of
canvas pan / zoom. The horizontal sidebar offset at typical widths
keeps the pill visually centred over the canvas area.
---
 src/index.html | 16 +++++++++++-----
 1 file changed, 11 insertions(+), 5 deletions(-)

diff --git a/src/index.html b/src/index.html
index 0fdfce6..587595a 100644
--- a/src/index.html
+++ b/src/index.html
@@ -783,7 +783,12 @@
     }
     .deckSlideActions button:hover { background: #f1f5f9; }
     #deckEditBar {
-      position: absolute; top: 10px; left: 50%; transform: translateX(-50%);
+      /* Pinned to the viewport so panning / zooming the canvas
+         doesn't drag the bar along. The bar still visually sits over
+         the canvas area because the sidebar is on the left — top:10px
+         + left:50% lands roughly centred over the canvas at common
+         widths. */
+      position: fixed; top: 10px; left: 50%; transform: translateX(-50%);
       z-index: 60; align-items: center; gap: 10px;
       background: var(--panel, #fff); border: 1px solid var(--line);
       border-radius: 999px; padding: 5px 14px 5px 8px;
@@ -1501,12 +1506,13 @@
       box-sizing: border-box;
       min-height: calc(100vh - 160px);
     }
-    /* Page-context bar — floats at the top-center over the canvas
-       while editing a book page. Mirrors the deck-edit-bar pill so
-       both flows feel consistent. */
+    /* Page-context bar — pinned to the viewport (not the scrolling
+       canvas) so panning / zooming doesn't drag it along. Top-center
+       placement lines up over the canvas area at typical sidebar
+       widths. */
     #bookPageEditBar {
       display: none;
-      position: absolute; top: 10px; left: 50%;
+      position: fixed; top: 10px; left: 50%;
       transform: translateX(-50%);
       z-index: 60;
       align-items: center; gap: 8px;