Update layout and notification styles - Move Saved notification next to title, use full page width, remove header gap
This commit is contained in:
@ -8,7 +8,7 @@
|
|||||||
background: #fff;
|
background: #fff;
|
||||||
border-bottom: 1px solid #c3c4c7;
|
border-bottom: 1px solid #c3c4c7;
|
||||||
box-shadow: 0 1px 0 rgba(0,0,0,.04);
|
box-shadow: 0 1px 0 rgba(0,0,0,.04);
|
||||||
margin: 0 -20px 20px -20px;
|
margin: 0 -20px 0 -20px;
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@ -133,8 +133,8 @@ input:checked + .wp-toggle-slider:before {
|
|||||||
/* Settings Container */
|
/* Settings Container */
|
||||||
.wpa-settings-container {
|
.wpa-settings-container {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
max-width: 1100px;
|
max-width: none;
|
||||||
margin: 0 auto;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.wpa-settings-content {
|
.wpa-settings-content {
|
||||||
@ -379,8 +379,8 @@ input:checked + .wp-toggle-slider:before {
|
|||||||
|
|
||||||
/* Theme Browser */
|
/* Theme Browser */
|
||||||
.theme-browser .theme {
|
.theme-browser .theme {
|
||||||
max-width: 1600px;
|
max-width: none;
|
||||||
margin: 0 auto;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Responsive Adjustments */
|
/* Responsive Adjustments */
|
||||||
@ -433,13 +433,16 @@ input:checked + .wp-toggle-slider:before {
|
|||||||
|
|
||||||
/* Settings Notification */
|
/* Settings Notification */
|
||||||
.wp-status {
|
.wp-status {
|
||||||
position: absolute !important;
|
position: relative !important;
|
||||||
right: 20px;
|
display: inline-flex;
|
||||||
top: 50%;
|
align-items: center;
|
||||||
transform: translateY(-50%);
|
margin-left: 15px;
|
||||||
|
transform: none;
|
||||||
|
top: auto;
|
||||||
|
right: auto;
|
||||||
background: #00a32a;
|
background: #00a32a;
|
||||||
color: white;
|
color: white;
|
||||||
padding: 6px 12px;
|
padding: 4px 12px;
|
||||||
border-radius: 12px;
|
border-radius: 12px;
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
@ -453,15 +456,15 @@ input:checked + .wp-toggle-slider:before {
|
|||||||
/* Plugin List Container */
|
/* Plugin List Container */
|
||||||
.wp-list-table-container {
|
.wp-list-table-container {
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
max-width: 1600px;
|
max-width: none;
|
||||||
padding: 0;
|
padding: 0 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Theme Container */
|
/* Theme Container */
|
||||||
#wpa-theme-list {
|
#wpa-theme-list {
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
max-width: 1600px;
|
max-width: none;
|
||||||
padding: 0;
|
padding: 0 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.wpa-loading-overlay {
|
.wpa-loading-overlay {
|
||||||
|
@ -1,14 +1,14 @@
|
|||||||
jQuery(document).ready(function($) {
|
jQuery(document).ready(function($) {
|
||||||
// Function to show notification
|
// Function to show notification
|
||||||
function showNotification(message, isError = false) {
|
function showNotification(message, isError = false) {
|
||||||
// Remove any existing notifications
|
// Remove any existing notification
|
||||||
$('.wp-status').remove();
|
$('.wp-status').remove();
|
||||||
|
|
||||||
// Add notification to header
|
// Create and append the new notification
|
||||||
var $notification = $('<span class="wp-status' + (isError ? ' error' : '') + '">' + message + '</span>');
|
var $notification = $('<span class="wp-status' + (isError ? ' error' : '') + '">' + message + '</span>');
|
||||||
$('.wp-allstars-header').append($notification);
|
$('.wp-allstars-header h1').after($notification);
|
||||||
|
|
||||||
// Fade out and remove after delay
|
// Remove the notification after 2 seconds
|
||||||
setTimeout(function() {
|
setTimeout(function() {
|
||||||
$notification.fadeOut(300, function() {
|
$notification.fadeOut(300, function() {
|
||||||
$(this).remove();
|
$(this).remove();
|
||||||
@ -37,14 +37,26 @@ jQuery(document).ready(function($) {
|
|||||||
var option = $input.attr('name');
|
var option = $input.attr('name');
|
||||||
var value = $input.is(':checked') ? 1 : 0;
|
var value = $input.is(':checked') ? 1 : 0;
|
||||||
|
|
||||||
updateOption(option, value)
|
$.ajax({
|
||||||
.then(function() {
|
url: ajaxurl,
|
||||||
showNotification('Setting saved');
|
type: 'POST',
|
||||||
})
|
data: {
|
||||||
.catch(function(error) {
|
action: 'wp_allstars_update_option',
|
||||||
console.error('Error:', error);
|
option: option,
|
||||||
showNotification('Error saving setting', true);
|
value: value,
|
||||||
});
|
nonce: wpAllstarsData.nonce
|
||||||
|
},
|
||||||
|
success: function(response) {
|
||||||
|
if (response.success) {
|
||||||
|
showNotification('Saved');
|
||||||
|
} else {
|
||||||
|
showNotification('Error saving settings', true);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
error: function() {
|
||||||
|
showNotification('Error saving settings', true);
|
||||||
|
}
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
// Handle text, number, and textarea inputs
|
// Handle text, number, and textarea inputs
|
||||||
@ -79,4 +91,9 @@ jQuery(document).ready(function($) {
|
|||||||
$settings.slideDown(200);
|
$settings.slideDown(200);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Handle form submission
|
||||||
|
$('form').on('submit', function() {
|
||||||
|
showNotification('Saved');
|
||||||
|
});
|
||||||
});
|
});
|
Reference in New Issue
Block a user