Fix icon hover colors, text alignment, and UI improvements

This commit is contained in:
Krikorios
2026-02-25 23:25:59 +02:00
parent 00fda3e045
commit fcc4352afa
46 changed files with 4011 additions and 600 deletions
+40 -8
View File
@@ -112,6 +112,12 @@
<span>Bookings</span>
</a>
</li>
<li class="nav-item">
<a href="/admin/availability.html" class="nav-link">
<i class="fas fa-clock"></i>
<span>Availability</span>
</a>
</li>
</ul>
</div>
@@ -154,7 +160,7 @@
</div>
<div class="header-right">
<button class="btn btn-primary" onclick="openAddTestimonialModal()">
<button class="btn btn-primary" id="add-testimonial-btn">
<i class="fas fa-plus"></i> Add Testimonial
</button>
@@ -243,7 +249,7 @@
<div class="modal-container">
<div class="modal-header">
<h2 id="modal-title">Add Testimonial</h2>
<button class="modal-close" onclick="closeModal()">&times;</button>
<button class="modal-close" id="testimonial-modal-close">&times;</button>
</div>
<div class="modal-body">
<form id="testimonial-form">
@@ -317,8 +323,8 @@
</form>
</div>
<div class="modal-footer">
<button class="btn btn-outline" onclick="closeModal()">Cancel</button>
<button class="btn btn-primary" onclick="saveTestimonial()">
<button class="btn btn-outline" id="testimonial-cancel-btn">Cancel</button>
<button class="btn btn-primary" id="testimonial-save-btn">
<i class="fas fa-save"></i> Save Testimonial
</button>
</div>
@@ -330,9 +336,35 @@
let allTestimonials = [];
document.addEventListener('DOMContentLoaded', function() {
setupEventListeners();
loadTestimonials();
});
function setupEventListeners() {
document.getElementById('add-testimonial-btn')?.addEventListener('click', openAddTestimonialModal);
document.getElementById('testimonial-modal-close')?.addEventListener('click', closeModal);
document.getElementById('testimonial-cancel-btn')?.addEventListener('click', closeModal);
document.getElementById('testimonial-save-btn')?.addEventListener('click', saveTestimonial);
const modalBackdrop = document.querySelector('#testimonial-modal .modal-backdrop');
modalBackdrop?.addEventListener('click', closeModal);
const grid = document.getElementById('testimonials-grid');
grid?.addEventListener('click', function(event) {
const actionBtn = event.target.closest('[data-action]');
if (!actionBtn) return;
const { action, id, status } = actionBtn.dataset;
if (action === 'update-status' && id && status) {
updateStatus(id, status);
} else if (action === 'edit' && id) {
editTestimonial(id);
} else if (action === 'delete' && id) {
deleteTestimonial(id);
}
});
}
async function loadTestimonials() {
try {
const response = await MSPE.API.get('testimonials.php');
@@ -387,18 +419,18 @@
</div>
<div class="testimonial-admin-actions">
${item.status === 'pending' ? `
<button class="btn btn-sm btn-primary" onclick="updateStatus('${item.id}', 'published')">
<button class="btn btn-sm btn-primary" data-action="update-status" data-id="${item.id}" data-status="published">
<i class="fas fa-check"></i> Approve
</button>
` : `
<button class="btn btn-sm btn-outline" onclick="updateStatus('${item.id}', 'pending')">
<button class="btn btn-sm btn-outline" data-action="update-status" data-id="${item.id}" data-status="pending">
<i class="fas fa-eye-slash"></i> Unpublish
</button>
`}
<button class="btn btn-sm btn-outline" onclick="editTestimonial('${item.id}')">
<button class="btn btn-sm btn-outline" data-action="edit" data-id="${item.id}">
<i class="fas fa-edit"></i> Edit
</button>
<button class="btn btn-sm btn-danger" onclick="deleteTestimonial('${item.id}')">
<button class="btn btn-sm btn-danger" data-action="delete" data-id="${item.id}">
<i class="fas fa-trash"></i>
</button>
</div>