dweam_web/game: fix controls collapsing

dweam-team · Jan 2, 2025 · 1798f14 · 1798f14
1 parent 9407bf7
commit 1798f14
Showing 1 changed file with 5 additions and 4 deletions.
diff --git a/dweam_web/src/pages/game/[type]/[id].astro b/dweam_web/src/pages/game/[type]/[id].astro
@@ -51,7 +51,7 @@ try {
                     </svg>
                   </div>
                 </button>
-                <div id="controls-wrapper" class="transition-all duration-300 overflow-hidden">
+                <div id="controls-wrapper" class="transition-all duration-300 overflow-hidden opacity-100">
                   <div id="controls-content" class="space-y-2 mt-4">
                     {Object.entries(gameData.buttons).map(([action, key]) => (
                       <div class="flex justify-between items-center">
@@ -143,13 +143,14 @@ try {
   const chevron = document.getElementById('controls-chevron');
 
   if (toggleButton && controlsWrapper && controlsContent && chevron) {
-    // Add a larger buffer to the height calculation
+    let isExpanded = true;
+
     controlsWrapper.style.maxHeight = (controlsContent.offsetHeight + 24) + 'px';
 
     toggleButton.addEventListener('click', () => {
-      const isExpanded = controlsWrapper.style.maxHeight !== '0px';
+      isExpanded = !isExpanded;
 
-      if (isExpanded) {
+      if (!isExpanded) {
         controlsWrapper.style.maxHeight = '0px';
         controlsWrapper.style.opacity = '0';
         chevron.style.transform = 'rotate(-90deg)';