From cd3bae732ba9d943781c5f3bf7a1e7734d89cc81 Mon Sep 17 00:00:00 2001
From: Marcus Quinn <marcus@agentdesign.co.uk>
Date: Sun, 16 Mar 2025 02:20:10 +0000
Subject: [PATCH] Fix accordion toggle functionality to prevent yoyo effect on
 first click

---
 admin/settings.php | 28 +++++++++-------------------
 1 file changed, 9 insertions(+), 19 deletions(-)

diff --git a/admin/settings.php b/admin/settings.php
index f1391b3..f20e1e7 100644
--- a/admin/settings.php
+++ b/admin/settings.php
@@ -742,31 +742,21 @@ function wp_allstars_settings_page() {
 
                     <script>
                     jQuery(document).ready(function($) {
-                        // Handle accordion functionality
-                        $('.wp-allstars-expand-settings').each(function() {
+                        $('.wp-allstars-expand-settings').on('click', function(e) {
+                            e.preventDefault();
+                            
                             var $button = $(this);
                             var $panel = $button.closest('.wp-allstars-toggle').find('.wp-allstars-toggle-settings');
                             var $icon = $button.find('.dashicons');
-                            
-                            // Set initial state without animation
                             var isExpanded = $button.attr('aria-expanded') === 'true';
-                            $panel.toggle(isExpanded);
+                            
+                            // Update state before animation
+                            isExpanded = !isExpanded;
+                            $button.attr('aria-expanded', isExpanded);
                             $icon.css('transform', isExpanded ? 'rotate(180deg)' : '');
                             
-                            // Handle click events
-                            $button.on('click', function(e) {
-                                e.preventDefault();
-                                
-                                // Toggle state
-                                isExpanded = !isExpanded;
-                                $button.attr('aria-expanded', isExpanded);
-                                
-                                // Update icon rotation
-                                $icon.css('transform', isExpanded ? 'rotate(180deg)' : '');
-                                
-                                // Animate panel only on click
-                                $panel.slideToggle(200);
-                            });
+                            // Animate panel
+                            $panel.slideToggle(200);
                         });
                     });
                     </script>