Before iOS 15, I was able to show the site fullscreen while scrolling down. This gesture hid the address and tabs bar (navigation bar) as showed on the gif bellow:
But something changed on iOS Safari and now this gesture doesn't hide it anymore:
I created a simple sandbox to demo this, using Material-UI (MUI) v5 with the CSS Baseline component
The code:
export default function Demo() {
const [landscapeAvailableHeight, setLandscapeAvailableHeight] = useState(0);
useEffect(() => {
setLandscapeAvailableHeight(
Math.min(window.screen.availHeight, window.screen.availWidth)
);
}, []);
return (
<Box
sx={{
backgroundColor: "tomato"
}}
>
<Box
sx={{
backgroundColor: "green",
display: "flex",
alignItems: "center",
justifyContent: "center",
height: landscapeAvailableHeight + 1
}}
>
landscapeAvailableHeight = {landscapeAvailableHeight}
</Box>
</Box>
);
}
What am I missing here? Any suggestion/help is appreciated. Thanks!

