From 847092774e23e6e8a14accfb1c3739faa8c14296 Mon Sep 17 00:00:00 2001 From: Nose Date: Mon, 8 Jun 2026 17:45:19 -0700 Subject: [PATCH] update app/ui-tarot-lightbox.js --- app/ui-tarot-lightbox.js | 32 +++++++++++++------------------- 1 file changed, 13 insertions(+), 19 deletions(-) diff --git a/app/ui-tarot-lightbox.js b/app/ui-tarot-lightbox.js index cf4673b..4ffbb9f 100644 --- a/app/ui-tarot-lightbox.js +++ b/app/ui-tarot-lightbox.js @@ -1624,17 +1624,20 @@ mobileNextButtonEl.style.display = canNavigate ? "inline-flex" : "none"; mobilePrevButtonEl.setAttribute("aria-label", previousLabel); mobileNextButtonEl.setAttribute("aria-label", nextLabel); - mobilePrevButtonEl.style.width = isCompact ? "56px" : "44px"; - mobileNextButtonEl.style.width = isCompact ? "56px" : "44px"; - mobilePrevButtonEl.style.height = isCompact ? "56px" : "44px"; - mobileNextButtonEl.style.height = isCompact ? "56px" : "44px"; - mobilePrevButtonEl.style.font = isCompact ? "800 24px/1 sans-serif" : "700 20px/1 sans-serif"; - mobileNextButtonEl.style.font = isCompact ? "800 24px/1 sans-serif" : "700 20px/1 sans-serif"; + mobilePrevButtonEl.style.width = isCompact ? "60px" : "44px"; + mobileNextButtonEl.style.width = isCompact ? "60px" : "44px"; + mobilePrevButtonEl.style.height = isCompact ? "60px" : "44px"; + mobileNextButtonEl.style.height = isCompact ? "60px" : "44px"; + mobilePrevButtonEl.style.font = isCompact ? "800 26px/1 sans-serif" : "700 20px/1 sans-serif"; + mobileNextButtonEl.style.font = isCompact ? "800 26px/1 sans-serif" : "700 20px/1 sans-serif"; if (!canNavigate) { return; } + const toolbarBottom = isCompact + ? "calc(12px + env(safe-area-inset-bottom, 0px))" + : null; const mobileInfoPanelVisible = Boolean( lightboxState.mobileInfoOpen && mobileInfoPanelEl @@ -1666,23 +1669,14 @@ helpPanelVisible && helpPanelEl instanceof HTMLElement ? helpPanelEl.offsetHeight + 12 : 0, deckPickerVisible && deckComparePanelEl instanceof HTMLElement ? deckComparePanelEl.offsetHeight + 12 : 0 ); - const buttonBottomOffset = Math.max( - 16, - mobileInfoPanelVisible ? infoPanelHeight + 16 : 16, - floatingPanelHeight ? floatingPanelHeight + 12 : 16 - ); const bottomOffset = isCompact - ? buttonBottomOffset - : toolbarHeight + floatingPanelHeight + (mobileInfoPanelVisible ? infoPanelHeight + 32 : 24); + ? toolbarBottom + : `${toolbarHeight + floatingPanelHeight + (mobileInfoPanelVisible ? infoPanelHeight + 32 : 24)}px`; mobilePrevButtonEl.style.top = "auto"; mobileNextButtonEl.style.top = "auto"; - mobilePrevButtonEl.style.bottom = isCompact - ? `calc(${bottomOffset}px + env(safe-area-inset-bottom, 0px))` - : `${bottomOffset}px`; - mobileNextButtonEl.style.bottom = isCompact - ? `calc(${bottomOffset}px + env(safe-area-inset-bottom, 0px))` - : `${bottomOffset}px`; + mobilePrevButtonEl.style.bottom = isCompact ? bottomOffset : bottomOffset; + mobileNextButtonEl.style.bottom = isCompact ? bottomOffset : bottomOffset; mobilePrevButtonEl.style.transform = "none"; mobileNextButtonEl.style.transform = "none"; }