refactor(app): improve design and responsive

mathieuher · Feb 8, 2024 · d642aac · d642aac
1 parent 08d65f9
commit d642aac
Showing 1 changed file with 10 additions and 5 deletions.
diff --git a/src/scss/game.scss b/src/scss/game.scss
@@ -46,6 +46,10 @@ html body {
         overflow: hidden;
         max-width: 100%;
 
+        @media only screen and (max-width: 800px) {
+            border-radius: 0;
+        }
+
         #back-to-welcome-button, 
         #back-to-setup-button {
             cursor: pointer;
@@ -56,7 +60,7 @@ html body {
             position: absolute;
             right: 0;
             width: 200px;
-            padding: 2rem;
+            padding: 1rem;
             gap: 1rem;
             display: flex;
             align-items: center;
@@ -75,9 +79,9 @@ html body {
             display: flex;
             flex-direction: column;
             padding-bottom: 1rem;
-            width: calc(100% - 4rem);
-            height: calc(100% - 4rem);
-            padding: 2rem;
+            width: calc(100% - 2rem);
+            height: calc(100% - 2rem);
+            padding: 1rem;
             border: none;
             color: $text;
             background-color: $primary;
@@ -99,11 +103,12 @@ html body {
             position: absolute;
             width: 100%;
             height: 100%;
-            z-index: 999;
+            z-index: 2;
 
             .title {
                 font-size: 1.3rem;
                 margin-bottom: 0;
+                padding: .5rem;
             }
 
             .section-title {