make front page mobile friendly, disable leaderboard on mobile

src/client/graphics/layers/Leaderboard.ts

@@ -129,6 +129,11 @@ export class Leaderboard extends LitElement implements Layer {
     .hidden {
       display: none !important;
     }
+    @media (max-width: 1000px) {
+      .leaderboard {
+        display: none !important;
+      }
+    }
   `;
 
   @property({type: Array})

src/client/graphics/layers/radial/EmojiTable.ts

@@ -66,6 +66,28 @@ export class EmojiTable extends LitElement {
         .hidden {
             display: none !important;
         }
+            
+        @media (max-width: 600px) {
+            .emoji-button {
+                font-size: 32px;
+                /* Slightly smaller font size for mobile */
+                width: 60px;
+                /* Smaller width for mobile */
+                height: 60px;
+                /* Smaller height for mobile */
+                margin: 5px;
+                /* Smaller margin for mobile */
+            }
+        }
+
+        @media (max-width: 400px) {
+            .emoji-button {
+                font-size: 28px;
+                width: 50px;
+                height: 50px;
+                margin: 3px;
+            }
+        }
     `;
 
     @state()

src/client/index.html

@@ -27,8 +27,8 @@
 					fill="#ffffff" />
 			</svg>
 		</a>
-		<h1 class="text-9xl">OpenFront.io</h1>
+		<h1 class="text-7xl sm:text-5xl md:text-6xl lg:text-7xl mb-2">OpenFront.io</h1>
-		<h2 class="text-6xl	mb-2">(v0.6.8)</h2>
+		<h2 class="text-3xl sm:text-4xl md:text-5xl lg:text-6xl mb-4">(v0.6.8)</h2>
 		<div class="flex justify-center items-start">
 			<div class="w-full max-w-3xl p-4 space-y-4">
 				<username-input></username-input>

src/client/styles.css

@@ -345,27 +345,3 @@ h3 {
     color: red;
 }
 
-/* EMOJI Table */
-
-
-@media (max-width: 600px) {
-    .emoji-button {
-        font-size: 32px;
-        /* Slightly smaller font size for mobile */
-        width: 60px;
-        /* Smaller width for mobile */
-        height: 60px;
-        /* Smaller height for mobile */
-        margin: 5px;
-        /* Smaller margin for mobile */
-    }
-}
-
-@media (max-width: 400px) {
-    .emoji-button {
-        font-size: 28px;
-        width: 50px;
-        height: 50px;
-        margin: 3px;
-    }
-}

src/core/configuration/DevConfig.ts

@@ -6,7 +6,7 @@ export const devConfig = new class extends DefaultConfig {
         return 95
     }
     numSpawnPhaseTurns(): number {
-        return 400
+        return 40
     }
     gameCreationRate(): number {
         return 20 * 1000