From 7eaff7dd1062e2f1261e9bfc60ff7172e29c1297 Mon Sep 17 00:00:00 2001
From: Cantuerk <21caog1bif@hft-stuttgart.de>
Date: Tue, 21 Jan 2025 15:41:52 +0000
Subject: [PATCH] Update public/ar_main.js, public/style.css

---
 public/ar_main.js | 45 ++++++++++++++++++++-------------------------
 public/style.css  |  6 ++----
 2 files changed, 22 insertions(+), 29 deletions(-)

diff --git a/public/ar_main.js b/public/ar_main.js
index 52984ea..d4e436a 100644
--- a/public/ar_main.js
+++ b/public/ar_main.js
@@ -356,32 +356,27 @@ function openMoveMenu() {
     const dynamicMenu = document.getElementById("dynamic-menu");
     dynamicMenu.style.display = "flex";
     dynamicMenu.innerHTML = `
-        <div id="move-menu">
-            <h3>Position anpassen</h3>
-            <label>
-                Verschiebungsgröße: <span id="move-delta-display">${moveDelta.toFixed(2)}</span>
-                <input type="range" min="0.01" max="1.0" step="0.01" value="${moveDelta}" onchange="updateMoveDelta(this.value)">
-            </label>
-            <div id="button-controls">
-                <button class="control-button" id="up" onclick="moveModelDynamic('z', -moveDelta)">
-                    <img src="assets/icons/up-arrow.png" alt="Up" />
-                </button>
-                <div class="middle-row">
-                    <button class="control-button" id="left" onclick="moveModelDynamic('x', -moveDelta)">
-                        <img src="assets/icons/left-arrow.png" alt="Left" />
-                    </button>
-                    <div class="spacer"></div>
-                    <button class="control-button" id="right" onclick="moveModelDynamic('x', moveDelta)">
-                        <img src="assets/icons/right-arrow.png" alt="Right" />
-                    </button>
-                </div>
-                <button class="control-button" id="down" onclick="moveModelDynamic('z', moveDelta)">
-                    <img src="assets/icons/down-arrow.png" alt="Down" />
-                </button>
-            </div>
-            <button onclick="closeDynamicMenu()">Zurück</button>
+    <h3>Position anpassen</h3>
+    <label>
+      Verschiebungsgröße: <span id="move-delta-display">${moveDelta.toFixed(2)}</span>
+      <input type="range" min="0.01" max="1.0" step="0.01" value="${moveDelta}" onchange="updateMoveDelta(this.value)">
+    </label>
+    <div style="display: flex; gap: 4px;">
+        <div class="control-button" id="left" onclick="moveModelDynamic('x', -moveDelta)">
+            <img src="assets/icons/left-arrow.png" alt="Up" />
+        </div>
+        <div class="control-button" id="right" onclick="moveModelDynamic('x', moveDelta)">
+            <img src="assets/icons/right-arrow.png" alt="Up" />
+        </div>
+        <div class="control-button" id="up" onclick="moveModelDynamic('z', -moveDelta)">
+            <img src="assets/icons/up-arrow.png" alt="Up" />
+        </div>
+        <div class="control-button" id="down" onclick="moveModelDynamic('z', moveDelta)">
+            <img src="assets/icons/down-arrow.png" alt="Up" />
         </div>
-    `;
+    </div>
+    <button onclick="closeDynamicMenu()">Zurück</button>
+  `;
 }
 
 function updateMoveDelta(value) {
diff --git a/public/style.css b/public/style.css
index 49fd00d..38cc221 100644
--- a/public/style.css
+++ b/public/style.css
@@ -253,7 +253,6 @@ button:active {
   flex-direction: column;
   align-items: center;
   justify-content: center;
-  gap: 2px;
 }
 
 #button-controls .middle-row {
@@ -274,9 +273,8 @@ button:active {
 }
 
 #button-controls .control-button img {
-  width: 100%;
-  height: 100%;
-  object-fit: contain;
+  width: 40px;
+  height: 40px;
 }
 
 #button-controls .control-button:active {
-- 
GitLab