Use dvh *everywhere*

Mobile Safari getting tricky
This commit is contained in:
Lim Chee Aun 2022-12-11 08:14:14 +08:00
parent 4c907c355f
commit ee074bec7f

View file

@ -8,6 +8,7 @@ html, body {
#app { #app {
min-height: 100vh; min-height: 100vh;
min-height: 100dvh;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@ -53,6 +54,7 @@ a.hashtag {
.deck { .deck {
min-height: 100vh; min-height: 100vh;
min-height: 100dvh;
margin: auto; margin: auto;
width: 40em; width: 40em;
max-width: 100vw; max-width: 100vw;
@ -64,6 +66,7 @@ a.hashtag {
overflow: auto; overflow: auto;
overflow-x: hidden; overflow-x: hidden;
height: 100vh; height: 100vh;
height: 100dvh;
} }
.deck header { .deck header {
@ -320,12 +323,14 @@ a.hashtag {
align-items: center; align-items: center;
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
height: 100dvh;
} }
.carousel > * :is(img, video) { .carousel > * :is(img, video) {
width: auto; width: auto;
max-width: 100vw; max-width: 100vw;
height: auto; height: auto;
max-height: 100vh; max-height: 100vh;
max-height: 100dvh;
} }
.carousel-top-controls { .carousel-top-controls {