feat: reduce font size and increase screen real estate usage on low r…

…esolution devices: resolve #45
snikproject · Oct 7, 2024 · cee51cd · cee51cd
1 parent 88c3ac0
commit cee51cd
Showing 1 changed file with 7 additions and 9 deletions.
diff --git a/src/style.css b/src/style.css
@@ -90,7 +90,7 @@ code {
 }
 
 .questions {
-  width: 85%;
+  width: 95%;
   margin: 35px auto 0;
 }
 
@@ -288,7 +288,7 @@ code {
 
 @media (min-width: 900px) {
   body {
-    font-size: 14px;
+    font-size: 13px;
   }
 
   h1 {
@@ -299,10 +299,6 @@ code {
     padding: 1em 0 0.5em;
   }
 
-  .questions {
-    width: 75%;
-  }
-
   .question-answer:hover {
     border-color: rgba(0, 0, 0, 0.5);
   }
@@ -316,17 +312,19 @@ code {
   }
 }
 
-@media (min-width: 1400px) {
+@media (min-width: 1400px) and (min-height: 1100px) {
   body {
     font-size: 16px;
   }
 
   .correct-modal {
     height: 400px;
   }
-}
 
-@media (min-width: 1600px) {
+  .questions {
+    width: 75%;
+  }
+
   body {
     overflow: hidden;
   }