From 8d12a5d2be53c8e076fc1b7be9d5a803fbba06d4 Mon Sep 17 00:00:00 2001
From: John Wooten <60260750+JFWooten4@users.noreply.github.com>
Date: Thu, 22 Oct 2026 06:57:44 -0400
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9E=20Preserve=20rounded=20PDF=20corne?=
 =?UTF-8?q?rs=20in=20narrow=20viewports?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Keep a small horizontal page gutter below 720px so the colored outline and inherited canvas corner radius remain visible in compact desktop panes. Replace the full-bleed regression assertion with coverage for the rounded page and gutter.

Co-authored-by: Codex Web <noreply@openai.com>
---
 src/viewer/viewer.css               |  8 ++------
 tests/narrow-viewer-layout.test.mjs | 11 ++++++-----
 2 files changed, 8 insertions(+), 11 deletions(-)

diff --git a/src/viewer/viewer.css b/src/viewer/viewer.css
index ddbb68f..7ea4700 100644
--- a/src/viewer/viewer.css
+++ b/src/viewer/viewer.css
@@ -1086,13 +1086,9 @@ input {
 }
 
 @media (max-width: 720px) {
+  /* Preserve the page outline and rounded corners in narrow split views. */
   .viewer {
-    padding-inline: 0;
-  }
-
-  .page {
-    width: 100%;
-    border-radius: 0;
+    padding-inline: 8px;
   }
 
   .toolbar {
diff --git a/tests/narrow-viewer-layout.test.mjs b/tests/narrow-viewer-layout.test.mjs
index 23acc64..5a5f938 100644
--- a/tests/narrow-viewer-layout.test.mjs
+++ b/tests/narrow-viewer-layout.test.mjs
@@ -6,11 +6,12 @@ const viewerStyles = readFileSync(new URL("../src/viewer/viewer.css", import.met
 const toolbarStyles = readFileSync(new URL("../src/viewer/navigation/toolbar-layout.css", import.meta.url), "utf8");
 const minimapStyles = readFileSync(new URL("../src/viewer/navigation/minimap.css", import.meta.url), "utf8");
 
-test("narrow PDF pages reach the horizontal viewport edges", () => {
-  assert.match(
-    viewerStyles,
-    /@media \(max-width: 720px\)[\s\S]*?\.viewer\s*\{[\s\S]*?padding-inline:\s*0;[\s\S]*?\}[\s\S]*?\.page\s*\{[\s\S]*?width:\s*100%;[\s\S]*?border-radius:\s*0;[\s\S]*?\}/,
-  );
+test("narrow PDF pages preserve rounded, outlined corners with side clearance", () => {
+  assert.match(viewerStyles, /\.page\s*\{[^}]*border-radius:\s*8px;[^}]*box-shadow:\s*0 0 0 1px var\(--page-border\);/);
+  assert.match(viewerStyles, /\.viewer\s*\{[^}]*padding:\s*calc\(52px \+ var\(--page-top-gap\)\) 16px/);
+  const narrowRules = viewerStyles.split("@media (max-width: 720px) {").at(-1).split("@media (max-width: 560px) {")[0];
+  assert.match(narrowRules, /\.viewer\s*\{\s*padding-inline:\s*8px;/);
+  assert.doesNotMatch(narrowRules, /\.page\s*\{/);
 });
 
 test("rendered page surfaces inherit the rounded page corners", () => {