commit 0345cd66944c60ab725a0d349772c3bfad682c56
parent f4a7b4fbc9ab2dfddb6547440a41d1daf88f506e
Author: Hunter
Date:   Wed,  4 Feb 2026 17:40:18 -0500

adjust spacing on fullscreen

Diffstat:
MREADME.md | 6+++++-
Mresources/editor.css | 2+-
Mresources/editor.js | 2+-
Mresources/spread-layout.js | 3++-
4 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/README.md b/README.md @@ -1,4 +1,8 @@ -# What if you could hold a website? +# If you have a printer, you're a publisher +Use HTML to make print-at-home zines from the comfort of your web browser. + + + open ```zine.html``` in your web browser (or <a href="https://hunterirving.github.io/zine.html/zines/zine.html/">click here</a>) then use ```⌘``` + ```P``` to print an 8-page mini zine to one sheet of 8.5 x 11" legal paper. <a href="https://hunterirving.github.io/zine.html/zines/zine.html/"><img src="resources/readme_images/zine-layout.png"></a> diff --git a/resources/editor.css b/resources/editor.css @@ -298,7 +298,7 @@ body { /* Compact height: fullscreen editor */ -@media (max-height: 200px) { +@media (max-height: 270px) { .preview-pane { display: none; } diff --git a/resources/editor.js b/resources/editor.js @@ -113,7 +113,7 @@ async function initializeEditor() { // Exit fullscreen when viewport is too short (matches CSS @media max-height: 200px) window.addEventListener('resize', function() { - if (getIsFullscreen() && window.innerHeight <= 200) { + if (getIsFullscreen() && window.innerHeight <= 270) { toggleFullscreen(); updatePreviewWrapper(); } diff --git a/resources/spread-layout.js b/resources/spread-layout.js @@ -70,7 +70,8 @@ export function scaleSpreadToFit(container, doc, bottomPadding = 0) { const spreadHeightPx = bookContainer.offsetHeight; if (spreadWidthPx === 0 || spreadHeightPx === 0) return; const scaleX = (vw - 40) / spreadWidthPx; - const scaleY = (vh - 134) / spreadHeightPx; + const verticalPadding = vh <= 630 ? 40 : 130; + const scaleY = (vh - verticalPadding) / spreadHeightPx; const scale = Math.min(scaleX, scaleY); // Use CSS zoom for high-resolution rendering instead of transform scale