forEach -> for, fit to viewport when the virtual keyboard is displayed

Author: SuperMaxusa

debug.html

@@ -2,7 +2,7 @@
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 
 <title>v86 (debug)</title>
-<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
+<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no,interactive-widget=resizes-content">
 
 <script src="build/capstone-x86.min.js"></script>
 <script src="build/libwabt.cjs"></script>

index.html

@@ -2,7 +2,7 @@
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 
 <title>v86</title>
-<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
+<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no,interactive-widget=resizes-content">
 <meta name="description" content="Run KolibriOS, Linux or Windows 98 in your browser">
 
 <script src="build/v86_all.js?98e7110c2"></script>

src/browser/main.js

@@ -2374,7 +2374,10 @@ function init_ui(profile, settings, emulator)
             $("toggle_zoom_to_fit").click();
         }
 
-        ["screen_container", "runtime_options", "runtime_infos", "filesystem_panel"].forEach(el => $(el).classList.toggle("theatre_" + el));
+        for(const el of ["screen_container", "runtime_options", "runtime_infos", "filesystem_panel"])
+        {
+            $(el).classList.toggle("theatre_" + el);
+        }
 
         $("theatre_background").style.display = theatre_mode ? "block" : "none";
         $("toggle_zoom_to_fit").style.display = theatre_mode ? "inline" : "none";

v86.css

@@ -217,7 +217,7 @@ input[type=number] {
 .theatre_screen_container {
     position: fixed;
     transform: translate(-50%, -50%);
-    top: 50vh;
+    top: 50dvh;
     left: 50vw;
     z-index: 2;
     outline: none !important;
@@ -263,7 +263,7 @@ input[type=number] {
 #theatre_background {
     position: fixed;
     width: 100vw;
-    height: 100vh;
+    height: 100dvh;
     top: 0;
     left: 0;
     background-color: black;