midgard/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Toggle fullscreen overlay on small screen heights, workaround/fix for #877

Browse source
This commit is contained in:
Pieter Vander Vennet 2022-06-29 19:14:57 +02:00
parent b5c48f65b0
commit 94475e4d4d
7 changed files with 14 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

5
UI/Base/ScrollableFullScreen.ts
View file

@ -110,8 +110,9 @@ export default class ScrollableFullScreen extends UIElement {
title = new Title(title, 2)
title.SetClass("text-l sm:text-xl md:text-2xl w-full p-0 max-h-20vh overflow-y-auto self-center")
const contentWrapper = new Combine([content])
.SetClass("block p-2 md:pt-4 w-full h-full overflow-y-auto md:max-h-65vh")
.SetClass("block p-2 md:pt-4 w-full h-full overflow-y-auto desktop:max-h-65vh")
this._resetScrollSignal.addCallback(_ => {
contentWrapper.ScrollToTop();
@ -124,7 +125,7 @@ export default class ScrollableFullScreen extends UIElement {
contentWrapper ,
// We add an ornament which takes around 5em. This is in order to make sure the Web UI doesn't hide
]).SetClass("flex flex-col h-full relative bg-white")
]).SetClass("fixed top-0 left-0 right-0 h-screen w-screen md:max-h-65vh md:w-auto md:relative z-above-controls md:rounded-xl overflow-hidden");
]).SetClass("fixed top-0 left-0 right-0 h-screen w-screen desktop:max-h-65vh md:w-auto md:relative z-above-controls md:rounded-xl overflow-hidden");
}