Dynamically observe browser height (accounts for changes in e.g. iOS Safari on scroll)

vh.css

:root {
    --vh: 1vh;
}

.c-browserheight {
    min-height: calc(100 * var(--vh));
}

vh.js

const setBrowserHeightVar = () => {
    document.documentElement.style.setProperty(
        "--vh",
        window.screen.height/100 + "px"
    );
};

setBrowserHeightVar();
window.addEventListener("resize", setBrowserHeightVar);
window.addEventListener("orientationchange", setBrowserHeightVar);