Browse Source

i forgor about phones 💀

Matthew Trejo 4 months ago
parent
commit
69aa5df85f
1 changed files with 21 additions and 2 deletions
  1. 21 2
      css/styles.css

+ 21 - 2
css/styles.css

@@ -28,11 +28,11 @@ body {
     image-rendering: -moz-crisp-edges;
     image-rendering: crisp-edges;
     cursor: pointer;
-    max-width: 100%;
-    height: auto;
     width: 640px;
     height: 480px;
+    max-width: 100%;
     max-height: 80vh;
+    object-fit: contain;
 }
 
 .controls {
@@ -127,6 +127,25 @@ body {
     }
 }
 
+/* Media query para orientación landscape en móviles */
+@media screen and (orientation: landscape) and (max-height: 600px) {
+    body {
+        padding: 5px;
+        min-height: 100vh;
+    }
+    
+    .game-container {
+        padding: 10px;
+    }
+    
+    #gameCanvas {
+        width: auto;
+        height: 85vh;
+        max-width: 90vw;
+        max-height: 85vh;
+    }
+}
+
 /* Estilos específicos para dispositivos táctiles */
 @media (hover: none) and (pointer: coarse) {
     .controls {