georges/MSPE
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix icon hover colors, text alignment, and UI improvements

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files
admin/pages.html
+51 -11
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>
@@ -210,11 +216,11 @@
<!-- Page Editor Modal -->
<div class="modal" id="page-modal">
<div class="modal-overlay" onclick="closePageModal()"></div>
<div class="modal-overlay" id="page-modal-overlay"></div>
<div class="modal-content" style="max-width:700px;">
<div class="modal-header">
<h3 id="page-modal-title">Edit Page</h3>
<button class="modal-close" onclick="closePageModal()"><i class="fas fa-times"></i></button>
<button class="modal-close" id="page-modal-close-btn"><i class="fas fa-times"></i></button>
</div>
<div class="modal-body" style="max-height:70vh;overflow-y:auto;">
<form id="page-form">
@@ -249,19 +255,19 @@
</form>
</div>
<div class="modal-footer">
<button class="btn btn-outline" onclick="closePageModal()">Cancel</button>
<button class="btn btn-primary" onclick="savePage()"><i class="fas fa-save"></i> Save Changes</button>
<button class="btn btn-outline" id="page-modal-cancel-btn">Cancel</button>
<button class="btn btn-primary" id="page-modal-save-btn"><i class="fas fa-save"></i> Save Changes</button>
</div>
</div>
</div>
<!-- Global Section Editor Modal -->
<div class="modal" id="global-modal">
<div class="modal-overlay" onclick="closeGlobalModal()"></div>
<div class="modal-overlay" id="global-modal-overlay"></div>
<div class="modal-content" style="max-width:550px;">
<div class="modal-header">
<h3 id="global-modal-title">Edit Section</h3>
<button class="modal-close" onclick="closeGlobalModal()"><i class="fas fa-times"></i></button>
<button class="modal-close" id="global-modal-close-btn"><i class="fas fa-times"></i></button>
</div>
<div class="modal-body">
<form id="global-form">
@@ -270,8 +276,8 @@
</form>
</div>
<div class="modal-footer">
<button class="btn btn-outline" onclick="closeGlobalModal()">Cancel</button>
<button class="btn btn-primary" onclick="saveGlobalSection()"><i class="fas fa-save"></i> Save</button>
<button class="btn btn-outline" id="global-modal-cancel-btn">Cancel</button>
<button class="btn btn-primary" id="global-modal-save-btn"><i class="fas fa-save"></i> Save</button>
</div>
</div>
</div>
@@ -283,10 +289,44 @@
let currentPageData = null;
document.addEventListener('DOMContentLoaded', function() {
setupPageEventListeners();
loadPages();
loadGlobalSections();
});
function setupPageEventListeners() {
document.getElementById('page-modal-overlay')?.addEventListener('click', closePageModal);
document.getElementById('page-modal-close-btn')?.addEventListener('click', closePageModal);
document.getElementById('page-modal-cancel-btn')?.addEventListener('click', closePageModal);
document.getElementById('page-modal-save-btn')?.addEventListener('click', savePage);
document.getElementById('global-modal-overlay')?.addEventListener('click', closeGlobalModal);
document.getElementById('global-modal-close-btn')?.addEventListener('click', closeGlobalModal);
document.getElementById('global-modal-cancel-btn')?.addEventListener('click', closeGlobalModal);
document.getElementById('global-modal-save-btn')?.addEventListener('click', saveGlobalSection);
document.getElementById('pages-grid')?.addEventListener('click', function(e) {
const editBtn = e.target.closest('[data-action="edit-page"]');
if (!editBtn) return;
const slug = editBtn.dataset.slug;
if (slug) editPage(slug);
});
document.getElementById('global-sections-grid')?.addEventListener('click', function(e) {
const editBtn = e.target.closest('[data-action="edit-global-section"]');
if (!editBtn) return;
const slug = editBtn.dataset.slug;
if (slug) editGlobalSection(slug);
});
document.getElementById('page-sections-editor')?.addEventListener('click', function(e) {
const toggle = e.target.closest('.section-toggle');
if (!toggle) return;
const body = toggle.nextElementSibling;
if (body) body.classList.toggle('collapsed');
});
}
// ── Load & Render ────────────────────────────────────
async function loadPages() {
@@ -327,7 +367,7 @@
<a href="${page.url || '#'}" target="_blank" class="btn btn-sm btn-outline">
<i class="fas fa-eye"></i> View
</a>
<button class="btn btn-sm btn-primary" onclick="editPage('${page.slug}')">
<button class="btn btn-sm btn-primary" data-action="edit-page" data-slug="${MSPE.escapeHtml(page.slug || '')}">
<i class="fas fa-edit"></i> Edit
</button>
</div>
@@ -356,7 +396,7 @@
<h4>${s.label}</h4>
<p>${s.description}</p>
</div>
<button class="btn btn-sm btn-outline" onclick="editGlobalSection('${s.slug}')">Edit</button>
<button class="btn btn-sm btn-outline" data-action="edit-global-section" data-slug="${MSPE.escapeHtml(s.slug || '')}">Edit</button>
</div>
`).join('');
}
@@ -395,7 +435,7 @@
}).join('');
return `<div style="margin-bottom:1.5rem;border:1px solid var(--gray-200);border-radius:var(--radius-sm);overflow:hidden;">
<div style="background:var(--gray-100);padding:.625rem 1rem;font-size:.8rem;font-weight:600;color:var(--dark);display:flex;align-items:center;gap:.5rem;cursor:pointer;" onclick="this.parentElement.querySelector('.sect-body').classList.toggle('collapsed')">
<div class="section-toggle" style="background:var(--gray-100);padding:.625rem 1rem;font-size:.8rem;font-weight:600;color:var(--dark);display:flex;align-items:center;gap:.5rem;cursor:pointer;">
<i class="fas fa-puzzle-piece" style="color:var(--primary);"></i> ${section.label}
<i class="fas fa-chevron-down" style="margin-left:auto;font-size:.65rem;color:var(--gray-400);"></i>
</div>