[object Object]

← back to Dw Photo Capture

photo-capture: raise UI scale to 1.35x + extend to batch-shoot + remote-cam

131d2a5f94eb8636c2a3accd2f58718f50be14af · 2026-09-19 18:37:21 -0700 · Steve Abrams

Editor --ui-scale 1.2->1.35 (Steve: 'bigger'). Applied the same --ui-scale +
root zoom to the two full-screen camera surfaces (batch.html, cam.html):
their views are position:fixed;inset:0 so they stay edge-to-edge under zoom;
only viewport-relative sizes (body min-height:100dvh, .view height, .tp-body
max-height:62vh) are divided back by the scale so nothing overflows.

Tested headless iPad(834x1194)+iPhone(390x844) on /  /batch  /cam at 1.35x:
no horizontal overflow, camera views fill screen, foot control bar within
viewport, 0 console errors on every surface. Local only — prod deploy gated (TK-11928).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01R7xZDug8zdDbhKLnSx4QCq

Files touched

Diff

commit 131d2a5f94eb8636c2a3accd2f58718f50be14af
Author: Steve Abrams <steve@designerwallcoverings.com>
Date:   Sat Sep 19 18:37:21 2026 -0700

    photo-capture: raise UI scale to 1.35x + extend to batch-shoot + remote-cam
    
    Editor --ui-scale 1.2->1.35 (Steve: 'bigger'). Applied the same --ui-scale +
    root zoom to the two full-screen camera surfaces (batch.html, cam.html):
    their views are position:fixed;inset:0 so they stay edge-to-edge under zoom;
    only viewport-relative sizes (body min-height:100dvh, .view height, .tp-body
    max-height:62vh) are divided back by the scale so nothing overflows.
    
    Tested headless iPad(834x1194)+iPhone(390x844) on /  /batch  /cam at 1.35x:
    no horizontal overflow, camera views fill screen, foot control bar within
    viewport, 0 console errors on every surface. Local only — prod deploy gated (TK-11928).
    
    Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
    Claude-Session: https://claude.ai/code/session_01R7xZDug8zdDbhKLnSx4QCq
---
 public/batch.html | 12 ++++++++----
 public/cam.html   |  5 ++++-
 public/index.html |  2 +-
 3 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/public/batch.html b/public/batch.html
index 7e54de5..dfdd011 100644
--- a/public/batch.html
+++ b/public/batch.html
@@ -33,10 +33,14 @@
 <link rel="apple-touch-icon" href="/apple-touch-icon.png">
 <title>DW Batch Shoot</title>
 <style>
-  :root{ --bg:#0f0e0c; --ink:#f3efe7; --muted:#9a9184; --line:#2e2a25; --gold:#c8a24a; --green:#3fa06a; --red:#c0563f; --amber:#d8a53a; }
+  :root{ --ui-scale:1.35; /* "make all larger" — single dial for control/label size (1 = original). */
+         --bg:#0f0e0c; --ink:#f3efe7; --muted:#9a9184; --line:#2e2a25; --gold:#c8a24a; --green:#3fa06a; --red:#c0563f; --amber:#d8a53a; }
   *{box-sizing:border-box}
-  html,body{margin:0;height:100%;min-height:100dvh;background:#000;color:var(--ink);font:15px/1.4 -apple-system,BlinkMacSystemFont,sans-serif;-webkit-text-size-adjust:100%;overscroll-behavior:none}
-  @supports(height:100dvh){ .view{height:100dvh} }
+  /* Magnify controls/labels; full-screen views are position:fixed;inset:0 so they stay edge-to-edge
+     under zoom. Only viewport-relative sizes are divided back by the scale so nothing overflows. */
+  html{ zoom: var(--ui-scale); }
+  html,body{margin:0;height:100%;min-height:calc(100dvh / var(--ui-scale));background:#000;color:var(--ink);font:15px/1.4 -apple-system,BlinkMacSystemFont,sans-serif;-webkit-text-size-adjust:100%;overscroll-behavior:none}
+  @supports(height:100dvh){ .view{height:calc(100dvh / var(--ui-scale))} }
   button{font-family:inherit}
   .btn{appearance:none;border:1px solid var(--gold);background:#16140f;color:var(--gold);border-radius:12px;padding:13px 22px;font-weight:700;font-size:15px;cursor:pointer}
   .btn.primary{background:var(--gold);color:#1b1407;border-color:var(--gold)}
@@ -128,7 +132,7 @@
   .tp-title b{color:var(--gold)}
   .tp-grip{margin-left:2px;color:var(--muted);font:700 14px/1 sans-serif;letter-spacing:2px}
   .tp-btn{margin-left:auto;width:34px;height:30px;border-radius:9px;border:1px solid var(--line);background:#16140f;color:var(--gold);font:700 15px/1 sans-serif;cursor:pointer}
-  .tp-body{padding:11px 12px 12px;display:flex;flex-direction:column;gap:9px;max-height:62vh;overflow:auto}
+  .tp-body{padding:11px 12px 12px;display:flex;flex-direction:column;gap:9px;max-height:calc(62vh / var(--ui-scale));overflow:auto}
   .toolpanel.collapsed .tp-body{display:none}
   /* sliders */
   .sld{display:block}
diff --git a/public/cam.html b/public/cam.html
index ccd5c08..3e8c2ae 100644
--- a/public/cam.html
+++ b/public/cam.html
@@ -33,7 +33,10 @@
 <link rel="apple-touch-icon" href="/apple-touch-icon.png">
 <title>DW Remote Cam</title>
 <style>
-  :root{ --bg:#0f0e0c; --ink:#f3efe7; --muted:#9a9184; --line:#2e2a25; --gold:#c8a24a; --green:#3fa06a; --red:#c0563f; }
+  :root{ --ui-scale:1.35; /* "make all larger" — single dial for control/label size (1 = original). */
+         --bg:#0f0e0c; --ink:#f3efe7; --muted:#9a9184; --line:#2e2a25; --gold:#c8a24a; --green:#3fa06a; --red:#c0563f; }
+  /* Full-screen elements are position:fixed;inset:0, so root zoom magnifies controls without overflow. */
+  html{ zoom: var(--ui-scale); }
   *{box-sizing:border-box}
   html,body{margin:0;height:100%;background:#000;color:var(--ink);font:15px/1.4 -apple-system,BlinkMacSystemFont,sans-serif;-webkit-text-size-adjust:100%;overscroll-behavior:none}
   #stage{position:fixed;inset:0;background:#000;display:flex;align-items:center;justify-content:center;overflow:hidden}
diff --git a/public/index.html b/public/index.html
index 3a5dd48..e7aecfa 100644
--- a/public/index.html
+++ b/public/index.html
@@ -38,7 +38,7 @@
 <link rel="manifest" href="/manifest.webmanifest">
 <title>Mobile DW SKU Photos</title>
 <style>
-  :root{ --ui-scale:1.2; /* "make all larger" — single dial for global UI size (1 = original). */
+  :root{ --ui-scale:1.35; /* "make all larger" — single dial for global UI size (1 = original). */
          --cols: 1; --bg:#0f0e0c; --card:#1b1916; --ink:#f3efe7; --muted:#9a9184; --line:#2e2a25;
          --gold:#c8a24a; --green:#3fa06a; --red:#c0563f; }
   /* Uniform magnification of the whole editor (fonts, controls, thumbs) — scrolls, so no clipping. */

← 3b83a72 photo-capture: global 1.2x UI scale on editor (--ui-scale di  ·  back to Dw Photo Capture  ·  auto-data-snapshot: 2026-09-19T18:59:45 (2 data files) — dat 08460f7 →