From 223b0f692299759b98f61cbfcf7c5309f3299026 Mon Sep 17 00:00:00 2001
From: Marcus Quinn <marcus@agentdesign.co.uk>
Date: Tue, 25 Mar 2025 02:57:25 +0000
Subject: [PATCH] Update Modern Admin Colors description and fix color scheme
 toggle functionality

---
 admin/includes/class-settings-manager.php   |  2 +-
 includes/class-wp-allstars-admin-colors.php | 45 +++++++++++++--------
 2 files changed, 30 insertions(+), 17 deletions(-)

diff --git a/admin/includes/class-settings-manager.php b/admin/includes/class-settings-manager.php
index 150425d..519d8c2 100644
--- a/admin/includes/class-settings-manager.php
+++ b/admin/includes/class-settings-manager.php
@@ -91,7 +91,7 @@ class WP_Allstars_Settings_Manager {
                             </div>
                         </div>
                         <p class="wp-setting-description">
-                            <?php esc_html_e('Switch to the Modern Admin colour scheme, to remind that you\'re using an SEO Pro Stack :)', 'wp-allstars'); ?>
+                            <?php esc_html_e('Switch to the Modern Admin colours, to remind that you\'re using an SEO Pro Stack :)', 'wp-allstars'); ?>
                         </p>
                     </div>
                 </div>
diff --git a/includes/class-wp-allstars-admin-colors.php b/includes/class-wp-allstars-admin-colors.php
index fbc3a4f..8baba94 100644
--- a/includes/class-wp-allstars-admin-colors.php
+++ b/includes/class-wp-allstars-admin-colors.php
@@ -73,8 +73,7 @@ class WP_Allstars_Admin_Colors {
             
             // Function to dynamically apply admin color scheme
             function applyAdminColorScheme(enableModern) {
-                // Get the stylesheets we need to replace
-                var $adminColors = $("link[href*=\'colors\']");
+                console.log("Applying admin color scheme:", enableModern ? "modern" : "default");
                 
                 // AJAX request to get the new color scheme URLs
                 $.ajax({
@@ -87,24 +86,38 @@ class WP_Allstars_Admin_Colors {
                     },
                     success: function(response) {
                         if (response.success && response.data) {
+                            console.log("Received color scheme data:", response.data);
+                            
                             // Replace the stylesheets
                             $.each(response.data, function(index, styleData) {
-                                var $oldStyle = $("link[href*=\'" + styleData.id + "\']");
-                                if ($oldStyle.length) {
-                                    // Create a new link element
-                                    var $newStyle = $("<link>", {
-                                        rel: "stylesheet",
-                                        id: styleData.id,
-                                        href: styleData.url,
-                                        type: "text/css"
-                                    });
-                                    
-                                    // Replace the old style with the new one
-                                    $oldStyle.after($newStyle);
-                                    $oldStyle.remove();
-                                }
+                                // Find any style with "colors" in the URL or ID
+                                var colorStyleSelector = "link[href*=\'colors\'], link[id*=\'colors\']";
+                                var $oldStyles = $(colorStyleSelector);
+                                
+                                console.log("Found color stylesheets:", $oldStyles.length);
+                                
+                                // Create a new link element
+                                var $newStyle = $("<link>", {
+                                    rel: "stylesheet",
+                                    id: styleData.id,
+                                    href: styleData.url,
+                                    type: "text/css"
+                                });
+                                
+                                // Add new style at the end of head
+                                $("head").append($newStyle);
+                                
+                                // Remove old styles after a short delay to ensure new one loads
+                                setTimeout(function() {
+                                    $oldStyles.remove();
+                                }, 100);
                             });
+                        } else {
+                            console.error("Error getting color scheme data:", response);
                         }
+                    },
+                    error: function(xhr, status, error) {
+                        console.error("AJAX error:", error);
                     }
                 });
             }