Fix icon hover colors, text alignment, and UI improvements
This commit is contained in:
+30
-13
@@ -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>
|
||||
|
||||
@@ -162,7 +168,7 @@
|
||||
<div class="header-notifications">
|
||||
<button class="notification-btn">
|
||||
<i class="fas fa-bell"></i>
|
||||
<span class="notification-badge">3</span>
|
||||
<span class="notification-badge" id="notif-badge">0</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@@ -325,8 +331,14 @@
|
||||
const stats = response.data;
|
||||
|
||||
// Update Messages Stats
|
||||
document.getElementById('stat-messages-count').textContent = stats.messages?.unread || 0;
|
||||
const unreadCount = stats.messages?.unread || 0;
|
||||
document.getElementById('stat-messages-count').textContent = unreadCount;
|
||||
document.getElementById('stat-messages-total').textContent = `${stats.messages?.total || 0} total`;
|
||||
const badge = document.getElementById('notif-badge');
|
||||
if (badge) {
|
||||
badge.textContent = unreadCount;
|
||||
badge.style.display = unreadCount > 0 ? '' : 'none';
|
||||
}
|
||||
|
||||
// Update Bookings Stats
|
||||
document.getElementById('stat-bookings-count').textContent = stats.bookings?.pending || 0;
|
||||
@@ -355,14 +367,14 @@
|
||||
container.innerHTML = response.data.map(item => `
|
||||
<div class="content-item">
|
||||
<div class="item-image">
|
||||
<img src="${item.featured_image || '/images/logo/logo.png'}" alt="${item.title}" style="object-fit: cover;">
|
||||
<img src="${item.featured_image || '/images/logo/logo.png'}" alt="${MSPE.escapeHtml(item.title)}" style="object-fit: cover;">
|
||||
</div>
|
||||
<div class="item-info">
|
||||
<h4>${item.title}</h4>
|
||||
<span class="item-meta">${MSPE.formatDate(item.created_at)} • ${item.category || 'News'}</span>
|
||||
<h4>${MSPE.escapeHtml(item.title)}</h4>
|
||||
<span class="item-meta">${MSPE.formatDate(item.created_at)} • ${MSPE.escapeHtml(item.category || 'News')}</span>
|
||||
</div>
|
||||
<div class="item-actions">
|
||||
<a href="/admin/news.html?edit=${item.id}" class="action-btn edit"><i class="fas fa-edit"></i></a>
|
||||
<a href="/admin/news.html?edit=${encodeURIComponent(item.id)}" class="action-btn edit"><i class="fas fa-edit"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
`).join('');
|
||||
@@ -392,19 +404,24 @@
|
||||
const container = document.getElementById('recent-messages');
|
||||
|
||||
if (response && response.success && response.data && response.data.length > 0) {
|
||||
container.innerHTML = response.data.map(msg => `
|
||||
<div class="message-item" style="cursor: pointer;" onclick="window.location.href='/admin/messages.html?id=${msg.id}'">
|
||||
container.innerHTML = response.data.map(msg => {
|
||||
const safeName = MSPE.escapeHtml((msg.first_name || 'Unknown') + ' ' + (msg.last_name || ''));
|
||||
const safePreview = MSPE.escapeHtml((msg.message || '').substring(0, 50)) + (msg.message && msg.message.length > 50 ? '...' : '');
|
||||
const safeStatus = ['unread', 'read', 'replied'].includes(msg.status) ? msg.status : 'unread';
|
||||
const safeId = encodeURIComponent(msg.id);
|
||||
return `
|
||||
<a class="message-item" style="cursor: pointer; text-decoration: none; color: inherit;" href="/admin/messages.html?id=${safeId}">
|
||||
<div class="message-avatar">
|
||||
<img src="https://ui-avatars.com/api/?name=${encodeURIComponent((msg.first_name || 'U') + ' ' + (msg.last_name || ''))}&background=random" alt="Avatar">
|
||||
</div>
|
||||
<div class="message-info">
|
||||
<h4>${msg.first_name || 'Unknown'} ${msg.last_name || ''}</h4>
|
||||
<p>${(msg.message || '').substring(0, 50)}${msg.message && msg.message.length > 50 ? '...' : ''}</p>
|
||||
<h4>${safeName}</h4>
|
||||
<p>${safePreview}</p>
|
||||
<span class="message-time">${MSPE.formatDate(msg.created_at)}</span>
|
||||
</div>
|
||||
<span class="message-status ${msg.status || 'unread'}"></span>
|
||||
</div>
|
||||
`).join('');
|
||||
<span class="message-status ${safeStatus}"></span>
|
||||
</a>`;
|
||||
}).join('');
|
||||
} else {
|
||||
container.innerHTML = `
|
||||
<div class="empty-state" style="padding: 2rem; text-align: center;">
|
||||
|
||||
Reference in New Issue
Block a user