[mirotalksfu] - Improve settings UI on small desktop screen

public/css/Room.css

@@ -470,7 +470,6 @@ body {
 #mySettings {
     z-index: 6;
     position: absolute;
-    margin: auto;
     padding: 10px;
     width: 50%;
     min-height: 480px;
@@ -480,21 +479,26 @@ body {
     border-radius: 10px;
     overflow-y: auto;
     overflow-x: hidden;
+    max-height: 90vh; /* Prevents overflow */
 }
 
 .mySettingsMain {
     display: flex;
 }
 
+/* Medium screens */
 @media screen and (max-width: 1030px) {
     #mySettings {
         width: 75%;
     }
 }
 
+/* Smaller screens */
 @media screen and (max-width: 830px) {
     #mySettings {
-        width: 80%;
+        width: 100%;
+        height: 100%;
+        max-height: 100vh;
         min-height: auto;
     }
     .mySettingsMain {
@@ -502,9 +506,12 @@ body {
     }
 }
 
+/* Fullscreen on mobile */
 @media screen and (max-width: 500px) {
     #mySettings {
-        width: 90%;
+        width: 100%;
+        height: 100%;
+        max-height: 100vh;
     }
 }