diff --git a/games/uptime/uptime-incident-response.html b/games/uptime/uptime-incident-response.html index 57cd883..0e88738 100644 --- a/games/uptime/uptime-incident-response.html +++ b/games/uptime/uptime-incident-response.html @@ -96,6 +96,12 @@ border:1px solid var(--line); border-radius:10px; position:relative; + align-self:start; + width:100%; + max-width:100%; + height:min(74vh, 660px); + min-height:420px; + isolation:isolate; overflow:hidden; aspect-ratio: 5 / 3; image-rendering:pixelated; @@ -350,7 +356,7 @@ body{ align-items:flex-start; padding:12px; } .wrap{ max-width:720px; } .board{ grid-template-columns:1fr; } - .map-panel{ aspect-ratio: 4 / 3; order:1; } + .map-panel{ aspect-ratio: 4 / 3; height:auto; min-height:0; order:1; } .side{ height:auto; min-height:0; order:2; } body.game-running .map-panel{ order:2; } body.game-running .side{ order:1; } @@ -415,7 +421,7 @@ .stat .val{ font-size:16px; } .stat .lbl{ font-size:7px; letter-spacing:0.12em; } .board{ grid-template-columns:minmax(0, 1fr) minmax(260px, 330px); gap:8px; } - .map-panel{ aspect-ratio:4 / 3; min-height:0; order:1; } + .map-panel{ aspect-ratio:4 / 3; height:calc(100svh - 74px); min-height:0; order:1; } .side{ order:2; height:calc(100svh - 74px); min-height:250px; } body.game-running .map-panel{ order:1; } body.game-running .side{ order:2; }