Fix design system violations: replace off-brand colors with terminal palette
- dashboard.css: replace all hardcoded Tailwind hex colors (#2d3748, #1a202c, #e2e8f0, #4a5568, #007cba, #3b82f6 etc.) in dark-mode sections and component styles with terminal CSS variables (--bg-*, --text-*, --border-color, --terminal-green/amber) - dashboard.css: fix card-priority colors white/black → var(--bg-primary) - dashboard.css: fix card-assignee border-radius: 50% → 0 (no circles rule) - dashboard.css: fix mobile bottom-sheet border-radius: 12px → 0 - dashboard.css: fix search-box focus border (#007cba → var(--terminal-green)) - dashboard.css: fix save-filter button blue (#3b82f6) → terminal green - dashboard.css: fix search-results-info blue highlight → terminal green - dashboard.css: fix btn-bulk/btn-secondary dark-mode bootstrap colors → terminal - ticket.css: replace comprehensive dark-mode Tailwind hex block with CSS vars - ticket.css: fix status-select white/black text → var(--bg-primary) - ticket.css: fix status-select.status-resolved hardcoded #28a745 → var(--status-open) - ticket.css: fix timeline dark-mode hardcoded colors → CSS vars - ticket.css: fix .slider:before background white → var(--bg-primary) - ticket.css: fix .btn-danger:hover color white → var(--bg-primary) - ticket.css: fix visibility-groups-list label border-radius: 4px → 0 - ticket.css: add will-change: opacity to age-warning/age-critical animations - views: bump CSS version strings to v=20260319c - views/DashboardView.php: add aria-labels to card view quick action buttons Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -13,7 +13,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
|
||||
<title>Ticket Dashboard</title>
|
||||
<link rel="icon" type="image/png" href="<?php echo $GLOBALS['config']['ASSETS_URL']; ?>/images/favicon.png">
|
||||
<link rel="stylesheet" href="/assets/css/base.css">
|
||||
<link rel="stylesheet" href="<?php echo $GLOBALS['config']['ASSETS_URL']; ?>/css/dashboard.css?v=20260319b">
|
||||
<link rel="stylesheet" href="<?php echo $GLOBALS['config']['ASSETS_URL']; ?>/css/dashboard.css?v=20260319c">
|
||||
<script nonce="<?php echo $nonce; ?>" src="/assets/js/base.js"></script>
|
||||
<script nonce="<?php echo $nonce; ?>" src="<?php echo $GLOBALS['config']['ASSETS_URL']; ?>/js/ascii-banner.js"></script>
|
||||
<script nonce="<?php echo $nonce; ?>" src="<?php echo $GLOBALS['config']['ASSETS_URL']; ?>/js/toast.js"></script>
|
||||
@@ -87,7 +87,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
|
||||
<span class="user-name">[ <?php echo htmlspecialchars(strtoupper($GLOBALS['currentUser']['display_name'] ?? $GLOBALS['currentUser']['username'])); ?> ]</span>
|
||||
<?php if ($GLOBALS['currentUser']['is_admin']): ?>
|
||||
<div class="admin-dropdown">
|
||||
<button class="admin-badge" data-action="toggle-admin-menu">[ ADMIN ▼ ]</button>
|
||||
<button class="admin-badge" data-action="toggle-admin-menu" aria-label="Admin menu" aria-haspopup="true" aria-expanded="false">[ ADMIN ▼ ]</button>
|
||||
<div class="admin-dropdown-content" id="adminDropdown">
|
||||
<a href="/admin/templates">TEMPLATES</a>
|
||||
<a href="/admin/workflow">WORKFLOW</a>
|
||||
@@ -279,7 +279,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
|
||||
<button type="submit" class="btn search-btn">Search</button>
|
||||
<button type="button" class="btn btn-secondary" data-action="open-advanced-search" title="Advanced Search">FILTER</button>
|
||||
<?php if (isset($_GET['search']) && !empty($_GET['search'])): ?>
|
||||
<a href="?" class="clear-search-btn">✗</a>
|
||||
<a href="?" class="clear-search-btn" aria-label="Clear search">✗</a>
|
||||
<?php endif; ?>
|
||||
</form>
|
||||
</div>
|
||||
@@ -292,7 +292,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
|
||||
</div>
|
||||
<button data-action="navigate" data-url="<?php echo $GLOBALS['config']['BASE_URL']; ?>/ticket/create" class="btn create-ticket">+ New Ticket</button>
|
||||
<div class="export-dropdown" id="exportDropdown" style="display: none;">
|
||||
<button class="btn" data-action="toggle-export-menu">↓ Export Selected (<span id="exportCount">0</span>)</button>
|
||||
<button class="btn" data-action="toggle-export-menu" aria-label="Export selected tickets" aria-haspopup="true" aria-expanded="false">↓ Export Selected (<span id="exportCount">0</span>)</button>
|
||||
<div class="export-dropdown-content" id="exportDropdownContent">
|
||||
<a href="#" data-action="export-tickets" data-format="csv">CSV</a>
|
||||
<a href="#" data-action="export-tickets" data-format="json">JSON</a>
|
||||
@@ -311,7 +311,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
|
||||
if ($page > 1) {
|
||||
$currentParams['page'] = $page - 1;
|
||||
$prevUrl = '?' . http_build_query($currentParams);
|
||||
echo "<button data-action='navigate' data-url='$prevUrl'>«</button>";
|
||||
echo "<button data-action='navigate' data-url='$prevUrl' aria-label='Previous page'>«</button>";
|
||||
}
|
||||
|
||||
// Page number buttons
|
||||
@@ -326,7 +326,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
|
||||
if ($page < $totalPages) {
|
||||
$currentParams['page'] = $page + 1;
|
||||
$nextUrl = '?' . http_build_query($currentParams);
|
||||
echo "<button data-action='navigate' data-url='$nextUrl'>»</button>";
|
||||
echo "<button data-action='navigate' data-url='$nextUrl' aria-label='Next page'>»</button>";
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
@@ -394,7 +394,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
|
||||
<?php foreach ($activeFilters as $filter): ?>
|
||||
<span class="filter-badge" data-filter-type="<?php echo htmlspecialchars($filter['type']); ?>" data-filter-value="<?php echo htmlspecialchars($filter['value']); ?>">
|
||||
<?php echo htmlspecialchars($filter['label']); ?>
|
||||
<button type="button" class="filter-remove" data-action="remove-filter" data-filter-type="<?php echo htmlspecialchars($filter['type']); ?>" data-filter-value="<?php echo htmlspecialchars($filter['value']); ?>" title="Remove filter">×</button>
|
||||
<button type="button" class="filter-remove" data-action="remove-filter" data-filter-type="<?php echo htmlspecialchars($filter['type']); ?>" data-filter-value="<?php echo htmlspecialchars($filter['value']); ?>" title="Remove filter" aria-label="Remove <?php echo htmlspecialchars($filter['label']); ?> filter">×</button>
|
||||
</span>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
@@ -408,7 +408,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
|
||||
<thead>
|
||||
<tr>
|
||||
<?php if ($GLOBALS['currentUser']['is_admin'] ?? false): ?>
|
||||
<th style="width: 40px;"><input type="checkbox" id="selectAllCheckbox" data-action="toggle-select-all"></th>
|
||||
<th style="width: 40px;" scope="col"><input type="checkbox" id="selectAllCheckbox" data-action="toggle-select-all" aria-label="Select all tickets"></th>
|
||||
<?php endif; ?>
|
||||
<?php
|
||||
$currentSort = isset($_GET['sort']) ? $_GET['sort'] : 'ticket_id';
|
||||
@@ -430,13 +430,14 @@ $nonce = SecurityHeadersMiddleware::getNonce();
|
||||
|
||||
foreach($columns as $col => $label) {
|
||||
if ($col === '_actions') {
|
||||
echo "<th style='width: 100px; text-align: center;'>$label</th>";
|
||||
echo "<th scope='col' style='width: 100px; text-align: center;'>$label</th>";
|
||||
} else {
|
||||
$newDir = ($currentSort === $col && $currentDir === 'asc') ? 'desc' : 'asc';
|
||||
$sortClass = ($currentSort === $col) ? "sort-$currentDir" : '';
|
||||
$ariaSort = ($currentSort === $col) ? "aria-sort='" . ($currentDir === 'asc' ? 'ascending' : 'descending') . "'" : '';
|
||||
$sortParams = array_merge($_GET, ['sort' => $col, 'dir' => $newDir]);
|
||||
$sortUrl = '?' . http_build_query($sortParams);
|
||||
echo "<th class='$sortClass' data-action='navigate' data-url='$sortUrl'>$label</th>";
|
||||
echo "<th scope='col' class='$sortClass' data-action='navigate' data-url='$sortUrl' $ariaSort>$label</th>";
|
||||
}
|
||||
}
|
||||
?>
|
||||
@@ -452,7 +453,7 @@ $nonce = SecurityHeadersMiddleware::getNonce();
|
||||
|
||||
// Add checkbox column for admins
|
||||
if ($GLOBALS['currentUser']['is_admin'] ?? false) {
|
||||
echo "<td data-action='toggle-row-checkbox' class='checkbox-cell'><input type='checkbox' class='ticket-checkbox' value='{$row['ticket_id']}' data-action='update-selection'></td>";
|
||||
echo "<td data-action='toggle-row-checkbox' class='checkbox-cell'><input type='checkbox' class='ticket-checkbox' value='{$row['ticket_id']}' data-action='update-selection' aria-label='Select ticket {$row[\"ticket_id\"]}'></td>";
|
||||
}
|
||||
|
||||
echo "<td><a href='/ticket/{$row['ticket_id']}' class='ticket-link'>{$row['ticket_id']}</a></td>";
|
||||
@@ -468,9 +469,9 @@ $nonce = SecurityHeadersMiddleware::getNonce();
|
||||
// Quick actions column
|
||||
echo "<td class='quick-actions-cell'>";
|
||||
echo "<div class='quick-actions'>";
|
||||
echo "<button data-action='view-ticket' data-ticket-id='{$row['ticket_id']}' class='quick-action-btn' title='View'>></button>";
|
||||
echo "<button data-action='quick-status' data-ticket-id='{$row['ticket_id']}' data-status='{$row['status']}' class='quick-action-btn' title='Change Status'>~</button>";
|
||||
echo "<button data-action='quick-assign' data-ticket-id='{$row['ticket_id']}' class='quick-action-btn' title='Assign'>@</button>";
|
||||
echo "<button data-action='view-ticket' data-ticket-id='{$row['ticket_id']}' class='quick-action-btn' title='View' aria-label='View ticket {$row[\"ticket_id\"]}'>></button>";
|
||||
echo "<button data-action='quick-status' data-ticket-id='{$row['ticket_id']}' data-status='{$row['status']}' class='quick-action-btn' title='Change Status' aria-label='Change status for ticket {$row[\"ticket_id\"]}'>~</button>";
|
||||
echo "<button data-action='quick-assign' data-ticket-id='{$row['ticket_id']}' class='quick-action-btn' title='Assign' aria-label='Assign ticket {$row[\"ticket_id\"]}'>@</button>";
|
||||
echo "</div>";
|
||||
echo "</td>";
|
||||
echo "</tr>";
|
||||
@@ -518,8 +519,8 @@ $nonce = SecurityHeadersMiddleware::getNonce();
|
||||
<?php echo $row['status']; ?>
|
||||
</div>
|
||||
<div class="ticket-card-actions">
|
||||
<button data-action="view-ticket" data-ticket-id="<?php echo $row['ticket_id']; ?>" title="View">></button>
|
||||
<button data-action="quick-status" data-ticket-id="<?php echo $row['ticket_id']; ?>" data-status="<?php echo $row['status']; ?>" title="Status">~</button>
|
||||
<button data-action="view-ticket" data-ticket-id="<?php echo $row['ticket_id']; ?>" title="View" aria-label="View ticket <?php echo $row['ticket_id']; ?>">></button>
|
||||
<button data-action="quick-status" data-ticket-id="<?php echo $row['ticket_id']; ?>" data-status="<?php echo $row['status']; ?>" title="Status" aria-label="Change status for ticket <?php echo $row['ticket_id']; ?>">~</button>
|
||||
</div>
|
||||
</div>
|
||||
<?php
|
||||
|
||||
Reference in New Issue
Block a user