From a8441fa7a88f314eda7598236280ef3ab3c6e7c7 Mon Sep 17 00:00:00 2001
From: Ethan O'Brien <77750390+ethanaobrien@users.noreply.github.com>
Date: Sat, 12 Aug 2023 11:05:50 -0500
Subject: [PATCH] Fix virtual gamepad alignment

---
 data/emulator.css | 13 ++++++++-----
 data/emulator.js  | 16 ++--------------
 2 files changed, 10 insertions(+), 19 deletions(-)

diff --git a/data/emulator.css b/data/emulator.css
index ee78d40..2fbc19d 100644
--- a/data/emulator.css
+++ b/data/emulator.css
@@ -255,15 +255,18 @@
     .ejs_settings_parent::after {
         right: 15px;
     }
-    .ejs_settings_leftside {
-        right: 50%
+    .ejs_settings_center_right {
+        right: -35%
     }
-    .ejs_settings_leftside::after {
-        right: 15px;
+    .ejs_settings_center_left {
+        right: -135%
     }
-    .ejs_settings_center::after {
+    .ejs_settings_center_right::after {
         right: 25%;
     }
+    .ejs_settings_center_left::after {
+        left: 25%;
+    }
     .ejs_menu_bar {
         transition: opacity .4s ease-in-out,transform .4s ease-in-out;
         position: absolute;
diff --git a/data/emulator.js b/data/emulator.js
index 6e88cdb..7245db5 100644
--- a/data/emulator.js
+++ b/data/emulator.js
@@ -3242,20 +3242,8 @@ class EmulatorJS {
             for (let i=0; i<menus.length; i++) {
                 menus[i].style['max-height'] = (height - 95) + "px";
             }
-            if (width < 575) {
-                const rect = this.settingsMenu.getBoundingClientRect();
-                if (rect.x < 0 ||
-                   (this.settingsMenu.classList.contains("ejs_settings_center") && rect.x-(rect.width/2) < 0)) {
-                    this.settingsMenu.classList.toggle("ejs_settings_center", true);
-                    this.settingsMenu.classList.toggle("ejs_settings_leftside", false);
-                } else {
-                    this.settingsMenu.classList.toggle("ejs_settings_leftside", !((window.innerWidth/2) > x));
-                    this.settingsMenu.classList.toggle("ejs_settings_center", false);
-                }
-            } else {
-                this.settingsMenu.classList.remove("ejs_settings_leftside");
-                this.settingsMenu.classList.remove("ejs_settings_center");
-            }
+            this.settingsMenu.classList.toggle("ejs_settings_center_left", (x < width/2) && (width < 575));
+            this.settingsMenu.classList.toggle("ejs_settings_center_right", (x >= width/2) && (width < 575));
             if (needChange) {
                 this.settingsMenu.style.display = "none";
                 this.settingsMenu.style.opacity = "";