diff --git a/packages/web/src/javascripts/App.tsx b/packages/web/src/javascripts/App.tsx index 3e8e7b92a..ea00622f2 100644 --- a/packages/web/src/javascripts/App.tsx +++ b/packages/web/src/javascripts/App.tsx @@ -60,7 +60,6 @@ const startApplication: StartApplication = async function startApplication( const setupViewportHeightListeners = () => { if (!isDesktop) { - setViewportHeightWithFallback() window.addEventListener('orientationchange', setViewportHeightWithFallback) window.addEventListener('resize', setViewportHeightWithFallback) } diff --git a/packages/web/src/javascripts/setViewportHeightWithFallback.tsx b/packages/web/src/javascripts/setViewportHeightWithFallback.tsx index 5f6d0d6a8..5497178c1 100644 --- a/packages/web/src/javascripts/setViewportHeightWithFallback.tsx +++ b/packages/web/src/javascripts/setViewportHeightWithFallback.tsx @@ -2,24 +2,15 @@ import { log, LoggingDomain } from './Logging' export const ViewportHeightKey = '--viewport-height' -export const setViewportHeightWithFallback = () => { - const newValue = visualViewport && visualViewport.height > 0 ? visualViewport.height : window.innerHeight - - if (!newValue) { - setCustomViewportHeight('100', 'vh') - return - } - - setCustomViewportHeight(String(newValue), 'px') -} - /** * @param forceTriggerResizeEvent On iPad at least, setProperty(ViewportHeightKey) does not trigger a resize event */ -export const setCustomViewportHeight = (height: string, suffix: 'px' | 'vh', forceTriggerResizeEvent = false) => { - log(LoggingDomain.Viewport, `setCustomViewportHeight: ${height}`) +export const setCustomViewportHeight = (height: number, suffix: 'px' | 'vh', forceTriggerResizeEvent = false) => { + const value = `${height}${suffix}` - document.documentElement.style.setProperty(ViewportHeightKey, `${height}${suffix}`) + log(LoggingDomain.Viewport, `setCustomViewportHeight: ${value}`) + + document.documentElement.style.setProperty(ViewportHeightKey, value) if (forceTriggerResizeEvent) { window.dispatchEvent(new Event('resize'))