78 lines
3.3 KiB
PHP
78 lines
3.3 KiB
PHP
<button class="btn btn-outline-secondary w-100" type="button" data-bs-toggle="offcanvas" data-bs-target="#historyOffcanvas" aria-controls="historyOffcanvas">
|
|
<i class="bi bi-clock-history"></i> View Full History & Comments
|
|
</button>
|
|
|
|
<div class="offcanvas offcanvas-end shadow-lg" tabindex="-1" id="historyOffcanvas" aria-labelledby="historyOffcanvasLabel" style="width: 450px;">
|
|
|
|
<div class="offcanvas-header border-bottom bg-light sticky-top z-3">
|
|
<h5 class="offcanvas-title fw-bold" id="historyOffcanvasLabel">Application History</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
|
|
</div>
|
|
|
|
<div class="offcanvas-body">
|
|
<div class="timeline" id="commentsTimeline">
|
|
|
|
<div class="timeline-item">
|
|
<div class="timeline-icon bg-primary text-white shadow-sm">
|
|
<i class="bi bi-file-earmark-arrow-up"></i>
|
|
</div>
|
|
<div class="timeline-content border rounded p-3 shadow-sm">
|
|
<div class="d-flex justify-content-between align-items-center mb-1">
|
|
<strong class="text-primary">Application Submitted</strong>
|
|
<small class="text-muted">16th May, 2026 - 2:15 PM</small>
|
|
</div>
|
|
<p class="mb-0 small text-muted">by Applicant Olivia Sampson</p>
|
|
</div>
|
|
</div>
|
|
<div class="timeline-item">
|
|
<div class="timeline-icon bg-secondary text-white shadow-sm">
|
|
<i class="bi bi-chat-text"></i>
|
|
</div>
|
|
<div class="timeline-content border rounded p-3 shadow-sm">
|
|
<div class="d-flex justify-content-between align-items-center mb-1">
|
|
<strong>Applicatant to review</strong>
|
|
<small class="text-muted">17th May, 2026 - 3:15 PM</small>
|
|
</div>
|
|
<p class="mb-0 text-dark small">Please ensure the architectural drawings include the updated drainage plan for the region.</p>
|
|
<p class="mb-0 small text-muted">Updated by Kafui Amuzu (Works, Head )</p>
|
|
</div>
|
|
</div>
|
|
<div class="timeline-item">
|
|
<div class="timeline-icon bg-success text-white shadow-sm">
|
|
<i class="bi bi-check-lg"></i>
|
|
</div>
|
|
<div class="timeline-content border rounded p-3 shadow-sm">
|
|
<div class="d-flex justify-content-between align-items-center mb-1">
|
|
<strong class="text-success">Application Received</strong>
|
|
<small class="text-muted">18th May, 2026 - 10:30 AM</small>
|
|
</div>
|
|
<p class="mb-2 small">All documents are in order</p>
|
|
<div>
|
|
<p class="mb-0 small text-muted">Updated by Luke Okyere (PPD Head)</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="offcanvas-footer border-top p-3 bg-light z-3">
|
|
<form>
|
|
<div class="mb-2">
|
|
<select class="form-select form-select-sm" aria-label="Update Status">
|
|
<option selected>Update status (Optional)...</option>
|
|
<option value="approved">Approved</option>
|
|
<option value="rejected">Rejected</option>
|
|
</select>
|
|
</div>
|
|
<textarea class="form-control mb-2" rows="2" placeholder="Write a comment..."></textarea>
|
|
<button class="btn btn-primary w-100 btn-sm" type="button">
|
|
<i class="bi bi-send"></i> Submit Update
|
|
</button>
|
|
</form>
|
|
</div>
|
|
|
|
</div>
|