Auto center the window vertically (#2686)

+ When the game is played in landscape format
    or in portrait format when it's not a touchscreen
This commit is contained in:
Dakurei 2024-09-17 18:55:50 +02:00 committed by GitHub
parent 18dc9d216c
commit 1fb5389765
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -26,11 +26,37 @@ body {
#app { #app {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center;
} }
#app > div:first-child { #app > div:first-child {
transform-origin: center !important;
}
/*
Supports automatic vertical centering as suggested in PR#1114, but only via CSS
Condition factorized to deduce CSS rules:
true if (isLandscape && !isMobile() && !hasTouchscreen() || (hasTouchscreen() && !isTouchControlsEnabled))
*/
/* isLandscape && !isMobile() && !hasTouchscreen() */
@media (orientation: landscape) and (pointer: fine) {
#app {
align-items: center;
}
}
@media (pointer: coarse) {
/* hasTouchscreen() && !isTouchControlsEnabled */
body:has(> #touchControls[class=visible]) #app {
align-items: start;
}
body:has(> #touchControls[class=visible]) #app > div:first-child {
transform-origin: top !important; transform-origin: top !important;
} }
}
#layout:fullscreen #dpad, #layout:fullscreen { #layout:fullscreen #dpad, #layout:fullscreen {
bottom: 6rem; bottom: 6rem;