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:
parent
18dc9d216c
commit
1fb5389765
26
index.css
26
index.css
|
@ -26,10 +26,36 @@ body {
|
|||
#app {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#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;
|
||||
}
|
||||
}
|
||||
|
||||
#layout:fullscreen #dpad, #layout:fullscreen {
|
||||
|
|
Loading…
Reference in New Issue