Fix icon hover colors, text alignment, and UI improvements
This commit is contained in:
+38
-13
@@ -451,15 +451,15 @@
|
||||
<div class="quick-slots">
|
||||
<label>Quick Add Times</label>
|
||||
<div class="quick-slots-grid">
|
||||
<button type="button" class="quick-slot-btn" onclick="addQuickTime('09:00')">9:00 AM</button>
|
||||
<button type="button" class="quick-slot-btn" onclick="addQuickTime('10:00')">10:00 AM</button>
|
||||
<button type="button" class="quick-slot-btn" onclick="addQuickTime('11:00')">11:00 AM</button>
|
||||
<button type="button" class="quick-slot-btn" onclick="addQuickTime('13:00')">1:00 PM</button>
|
||||
<button type="button" class="quick-slot-btn" onclick="addQuickTime('14:00')">2:00 PM</button>
|
||||
<button type="button" class="quick-slot-btn" onclick="addQuickTime('15:00')">3:00 PM</button>
|
||||
<button type="button" class="quick-slot-btn" onclick="addQuickTime('16:00')">4:00 PM</button>
|
||||
<button type="button" class="quick-slot-btn" onclick="addQuickTime('17:00')">5:00 PM</button>
|
||||
<button type="button" class="quick-slot-btn" onclick="addQuickTime('18:00')">6:00 PM</button>
|
||||
<button type="button" class="quick-slot-btn" data-time="09:00">9:00 AM</button>
|
||||
<button type="button" class="quick-slot-btn" data-time="10:00">10:00 AM</button>
|
||||
<button type="button" class="quick-slot-btn" data-time="11:00">11:00 AM</button>
|
||||
<button type="button" class="quick-slot-btn" data-time="13:00">1:00 PM</button>
|
||||
<button type="button" class="quick-slot-btn" data-time="14:00">2:00 PM</button>
|
||||
<button type="button" class="quick-slot-btn" data-time="15:00">3:00 PM</button>
|
||||
<button type="button" class="quick-slot-btn" data-time="16:00">4:00 PM</button>
|
||||
<button type="button" class="quick-slot-btn" data-time="17:00">5:00 PM</button>
|
||||
<button type="button" class="quick-slot-btn" data-time="18:00">6:00 PM</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -467,7 +467,7 @@
|
||||
<button type="submit" class="btn btn-primary">
|
||||
<i class="fas fa-plus"></i> Add Slot
|
||||
</button>
|
||||
<button type="button" class="btn btn-secondary" onclick="generateWeekSlots()">
|
||||
<button type="button" class="btn btn-secondary" id="generate-week-btn">
|
||||
<i class="fas fa-calendar-week"></i> Generate Week
|
||||
</button>
|
||||
</div>
|
||||
@@ -577,6 +577,31 @@
|
||||
document.getElementById('block-time-form').addEventListener('submit', handleBlockTime);
|
||||
document.getElementById('filter-date-from').addEventListener('change', filterSlots);
|
||||
document.getElementById('filter-date-to').addEventListener('change', filterSlots);
|
||||
document.getElementById('generate-week-btn').addEventListener('click', generateWeekSlots);
|
||||
|
||||
document.querySelector('.quick-slots-grid')?.addEventListener('click', function(event) {
|
||||
const btn = event.target.closest('.quick-slot-btn[data-time]');
|
||||
if (!btn) return;
|
||||
addQuickTime(btn.dataset.time);
|
||||
});
|
||||
|
||||
document.getElementById('blocked-times-list').addEventListener('click', function(event) {
|
||||
const btn = event.target.closest('[data-action="unblock-time"]');
|
||||
if (!btn) return;
|
||||
unblockTime(btn.dataset.id);
|
||||
});
|
||||
|
||||
document.getElementById('slots-table-body').addEventListener('click', function(event) {
|
||||
const btn = event.target.closest('[data-action]');
|
||||
if (!btn) return;
|
||||
|
||||
const { action, id } = btn.dataset;
|
||||
if (action === 'toggle-slot' && id) {
|
||||
toggleSlot(id);
|
||||
} else if (action === 'delete-slot' && id) {
|
||||
deleteSlot(id);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function setDefaultDate() {
|
||||
@@ -663,7 +688,7 @@
|
||||
<span style="font-weight: 600;">${formattedTime}</span>
|
||||
${blocked.reason ? `<span style="color: #64748b; font-size: 0.875rem; margin-left: 0.5rem;">(${blocked.reason})</span>` : ''}
|
||||
</div>
|
||||
<button onclick="unblockTime('${blocked.id}')" style="background: none; border: none; color: #dc2626; cursor: pointer; padding: 0.25rem;">
|
||||
<button data-action="unblock-time" data-id="${blocked.id}" style="background: none; border: none; color: #dc2626; cursor: pointer; padding: 0.25rem;">
|
||||
<i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
@@ -837,10 +862,10 @@
|
||||
<span style="color: var(--gray-500);">${slot.notes || '-'}</span>
|
||||
</td>
|
||||
<td>
|
||||
<button class="action-btn toggle" onclick="toggleSlot('${slot.id}')">
|
||||
<button class="action-btn toggle" data-action="toggle-slot" data-id="${slot.id}">
|
||||
<i class="fas fa-${isAvailable ? 'eye-slash' : 'eye'}"></i>
|
||||
</button>
|
||||
<button class="action-btn delete" onclick="deleteSlot('${slot.id}')">
|
||||
<button class="action-btn delete" data-action="delete-slot" data-id="${slot.id}">
|
||||
<i class="fas fa-trash"></i>
|
||||
</button>
|
||||
</td>
|
||||
|
||||
Reference in New Issue
Block a user