fix game list display for mobile because of vh bug
authorGeoffrey Allott <geoffrey@allott.email>
Fri, 2 Apr 2021 16:26:57 +0000 (17:26 +0100)
committerGeoffrey Allott <geoffrey@allott.email>
Fri, 2 Apr 2021 16:26:57 +0000 (17:26 +0100)
site/style/game-list.css

index 26f052ea41c8c368d3f50696961143760f0f0564..e44e83b2762a32934da0cbfcfa983a7481d2cf47 100644 (file)
@@ -1,33 +1,26 @@
 .game-list-outside {
     width: 100%;
     height: 100%;
-    display: grid;
+    display: flex;
+    flex-direction: column;
     overflow: hidden;
     font-size: 3vw;
-    align-content: stretch;
 }
 
 .game-list-outside > input {
-    grid-column: 1;
-    grid-row: 1;
-    align-self: start;
+    width: 100%;
     height: 4vw;
     font-size: inherit;
 }
 
 .game-list-outside > button {
-    grid-column: 1;
-    grid-row: 3;
-    align-self: end;
     height: 10vw;
+    width: 100%;
     font-size: inherit;
 }
 
 .game-list-container {
-    grid-column: 1;
-    grid-row: 2;
-    align-self: stretch;
-    height: calc(100vh - 16vw);
+    height: 100%;
     overflow-x: clip;
     overflow-y: scroll;
 }