From 9444b9b64f335bfed1de613bf43d82699d89a190 Mon Sep 17 00:00:00 2001 From: Christophe Date: Sun, 12 Apr 2026 18:02:26 +0200 Subject: [PATCH] Verrouille chrono et cube au viewport mobile --- app.js | 16 +++++ chrono.html | 2 +- styles.css | 189 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 206 insertions(+), 1 deletion(-) diff --git a/app.js b/app.js index a476505..ad75b9e 100644 --- a/app.js +++ b/app.js @@ -37,6 +37,17 @@ const MODES = { }, }; +syncViewportHeight(); +window.addEventListener("resize", syncViewportHeight); +window.addEventListener("pageshow", syncViewportHeight); +window.addEventListener("orientationchange", syncViewportHeight); +window.visualViewport?.addEventListener("resize", syncViewportHeight); +window.visualViewport?.addEventListener("scroll", syncViewportHeight); +window.setTimeout(syncViewportHeight, 0); +window.requestAnimationFrame(() => { + window.requestAnimationFrame(syncViewportHeight); +}); + let match = readStoredMatch(); let dirty = false; @@ -79,6 +90,11 @@ switch (PAGE) { break; } +function syncViewportHeight() { + const viewportHeight = window.visualViewport?.height ?? window.innerHeight; + document.documentElement.style.setProperty("--app-viewport-height", `${Math.round(viewportHeight)}px`); +} + function initSetupPage() { const form = document.querySelector("#setupForm"); const summary = document.querySelector("#setupSummary"); diff --git a/chrono.html b/chrono.html index 55d55bf..31d283c 100644 --- a/chrono.html +++ b/chrono.html @@ -21,7 +21,7 @@ -
+