Fix aspet-ratio for Chromium

2026-07-08 10:12:38 +01:00
parent 8f60b5dcda
commit 419664736e
1 changed files with 8 additions and 2 deletions
@@ -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; }