frontend: Mobile-Höhe per 100dvh statt 100vh (Panel hinter Browserleiste)
Auf Mobilgeräten ist 100vh die große Viewport-Höhe inkl. der Fläche hinter der unteren Browserleiste — Footer und die eingeklappte Editor-Titelzeile rutschen dahinter und sind nicht antippbar. 100dvh (dynamische Viewport-Höhe) folgt der sichtbaren Fläche; 100vh bleibt als Fallback für alte Browser. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Opus 4.8
parent
fe818b6c2c
commit
e97d168ef6
+7
-1
@@ -27,7 +27,13 @@
|
|||||||
repeating-linear-gradient(0deg,transparent 0 23px,var(--grid) 23px 24px),
|
repeating-linear-gradient(0deg,transparent 0 23px,var(--grid) 23px 24px),
|
||||||
repeating-linear-gradient(90deg,transparent 0 23px,var(--grid) 23px 24px),
|
repeating-linear-gradient(90deg,transparent 0 23px,var(--grid) 23px 24px),
|
||||||
var(--paper);
|
var(--paper);
|
||||||
height:100vh;overflow:hidden;
|
/* 100vh ist auf Mobilgeräten die *große* Viewport-Höhe (inkl. Fläche
|
||||||
|
hinter der unteren Browserleiste) — Footer/Editor-Titelzeile rutschen
|
||||||
|
dahinter. 100dvh = dynamische Viewport-Höhe, folgt der sichtbaren
|
||||||
|
Fläche. vh bleibt als Fallback für alte Browser. */
|
||||||
|
height:100vh;
|
||||||
|
height:100dvh;
|
||||||
|
overflow:hidden;
|
||||||
display:flex;flex-direction:column;
|
display:flex;flex-direction:column;
|
||||||
padding:24px 20px 12px;
|
padding:24px 20px 12px;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user