diff --git a/admin/css/wp-allstars-plugins.css b/admin/css/wp-allstars-plugins.css
index 64ac5d7..377286e 100644
--- a/admin/css/wp-allstars-plugins.css
+++ b/admin/css/wp-allstars-plugins.css
@@ -1,6 +1,7 @@
/* Plugin Browser Styles */
.wp-allstars-plugin-browser {
- margin: 0 -16px;
+ margin: 0 -8px;
+ padding: 0 8px;
}
/* Plugin List Container */
@@ -8,6 +9,7 @@
display: flex;
flex-wrap: wrap;
margin: 0;
+ width: 100%;
}
/* Filter Bar */
@@ -259,18 +261,10 @@
z-index: 100;
}
-.wp-allstars-loading-spinner {
- width: 50px;
- height: 50px;
- border: 5px solid #f3f3f3;
- border-top: 5px solid #3498db;
- border-radius: 50%;
- animation: spin 2s linear infinite;
-}
-
-@keyframes spin {
- 0% { transform: rotate(0deg); }
- 100% { transform: rotate(360deg); }
+.wp-allstars-loading-overlay .spinner {
+ float: none;
+ visibility: visible;
+ margin: 0;
}
/* Theme Browser */
@@ -357,18 +351,18 @@
/* Pro Buttons */
.go-pro-button {
- background: #ff8c00;
- border-color: #ff7b00;
- color: #fff;
- box-shadow: 0 1px 0 #ff7b00;
- text-shadow: 0 -1px 1px #ff7b00, 1px 0 1px #ff7b00, 0 1px 1px #ff7b00, -1px 0 1px #ff7b00;
+ background: #ff8c00 !important;
+ border-color: #ff7b00 !important;
+ color: #fff !important;
+ box-shadow: 0 1px 0 #ff7b00 !important;
+ text-shadow: 0 -1px 1px #ff7b00, 1px 0 1px #ff7b00, 0 1px 1px #ff7b00, -1px 0 1px #ff7b00 !important;
}
.go-pro-button:hover,
.go-pro-button:focus {
- background: #ff9d1c;
- border-color: #ff7b00;
- color: #fff;
+ background: #ff9d1c !important;
+ border-color: #ff7b00 !important;
+ color: #fff !important;
}
/* More Details Link */
@@ -390,6 +384,23 @@
text-align: right;
}
+/* Settings Notifications */
+.wp-setting-notification {
+ display: inline-block;
+ background: #72aee6;
+ color: #fff;
+ padding: 5px 10px;
+ border-radius: 3px;
+ margin-left: 10px;
+ font-size: 12px;
+ line-height: 1.2;
+ vertical-align: middle;
+}
+
+.wp-setting-notification.error {
+ background: #d63638;
+}
+
/* Responsive Adjustments */
@media only screen and (max-width: 1120px) {
.plugin-card {
diff --git a/admin/js/wp-allstars-admin.js b/admin/js/wp-allstars-admin.js
index accd449..72ecd8f 100644
--- a/admin/js/wp-allstars-admin.js
+++ b/admin/js/wp-allstars-admin.js
@@ -1,6 +1,6 @@
jQuery(document).ready(function($) {
// Function to show notification
- function showNotification(message, element, isError = false) {
+ function showNotification(message, $element, isError = false) {
// Remove any existing notifications
$('.wp-setting-notification').remove();
@@ -8,8 +8,8 @@ jQuery(document).ready(function($) {
var $notification = $('' + message + '');
// If element is provided, show notification next to it
- if (element) {
- $(element).after($notification);
+ if ($element && $element.length) {
+ $element.after($notification);
} else {
// Fallback to header if no element provided
$('.wp-allstars-header h1').after($notification);
@@ -24,7 +24,7 @@ jQuery(document).ready(function($) {
}
// Handle option updates
- function updateOption(option, value, element) {
+ function updateOption(option, value) {
return $.ajax({
url: ajaxurl,
type: 'POST',
@@ -32,7 +32,7 @@ jQuery(document).ready(function($) {
action: 'wp_allstars_update_option',
option: option,
value: value,
- _wpnonce: wpAllstars.nonce
+ nonce: wpAllstars.nonce
}
}).then(function(response) {
if (!response.success) {
@@ -61,13 +61,31 @@ jQuery(document).ready(function($) {
var $input = $(this);
var option = $input.attr('name');
var value = $input.is(':checked') ? 1 : 0;
+ var $label = $input.closest('.wp-setting-left, .wp-allstars-toggle-left').find('label');
updateOption(option, value)
.then(function() {
- showNotification('Saved', $input.closest('.wp-setting-left, .wp-allstars-toggle-left'));
+ showNotification('Saved', $label);
})
.catch(function() {
- showNotification('Error saving settings', $input.closest('.wp-setting-left, .wp-allstars-toggle-left'), true);
+ showNotification('Error saving settings', $label, true);
+ });
+ });
+
+ // Handle text input changes
+ $('.wp-allstars-setting-row input[type="text"], .wp-allstars-setting-row input[type="number"], .wp-allstars-setting-row textarea').on('change', function() {
+ var $input = $(this);
+ var option = $input.attr('name');
+ var value = $input.val();
+ var $label = $input.closest('.wp-allstars-setting-row').find('label').first();
+
+ updateOption(option, value)
+ .then(function() {
+ showNotification('Saved', $label);
+ })
+ .catch(function(error) {
+ console.error('Error:', error);
+ showNotification('Error saving setting', $label, true);
});
});
@@ -123,7 +141,7 @@ jQuery(document).ready(function($) {
// Function to load plugins
function loadPlugins(category) {
var $container = $('#wpa-plugin-list');
- var $loadingOverlay = $('');
+ var $loadingOverlay = $('
');
// Show loading overlay
$container.css('position', 'relative').append($loadingOverlay);
@@ -169,7 +187,7 @@ jQuery(document).ready(function($) {
// Function to load themes
function loadTheme() {
var $container = $('#wpa-theme-list');
- var $loadingOverlay = $('');
+ var $loadingOverlay = $('
');
// Show loading overlay
$container.css('position', 'relative').append($loadingOverlay);
diff --git a/admin/settings.php b/admin/settings.php
index dd2174c..941b3bb 100644
--- a/admin/settings.php
+++ b/admin/settings.php
@@ -627,7 +627,7 @@ function wp_allstars_settings_page() {
if ($("#wpa-plugin-list").length && $("#wpa-plugin-list").is(":empty")) {
var category = "' . esc_js($active_category) . '";
var $container = $("#wpa-plugin-list");
- var $loadingOverlay = $("");
+ var $loadingOverlay = $("
");
// Show loading overlay
$container.css("position", "relative").append($loadingOverlay);
@@ -676,7 +676,7 @@ function wp_allstars_settings_page() {
jQuery(document).ready(function($) {
if ($("#wpa-theme-list").length && $("#wpa-theme-list").is(":empty")) {
var $container = $("#wpa-theme-list");
- var $loadingOverlay = $("");
+ var $loadingOverlay = $("
");
// Show loading overlay
$container.css("position", "relative").append($loadingOverlay);
@@ -832,7 +832,7 @@ function wp_allstars_settings_page() {