a11y: aria-pressed for all pill groups, aria-label on search inputs and buttons
Lint / Python (flake8) (push) Successful in 46s
Lint / JS (eslint) (push) Successful in 10s
Security / Python Security (bandit) (push) Successful in 51s
Test / Python Tests (pytest) (push) Successful in 1m8s
Lint / Notify on failure (push) Has been skipped
Lint / Deploy (push) Successful in 4s
Lint / Python (flake8) (push) Successful in 46s
Lint / JS (eslint) (push) Successful in 10s
Security / Python Security (bandit) (push) Successful in 51s
Test / Python Tests (pytest) (push) Successful in 1m8s
Lint / Notify on failure (push) Has been skipped
Lint / Deploy (push) Successful in 4s
- Add role="group" + aria-label to duration-pills and sev-pills containers - Add aria-pressed to severity filter, duration, and refresh-interval pills - Keep aria-pressed in sync with JS (setDuration, applyRefreshPillUI, modal reset) - Add aria-label to events-search, host-search, links-search inputs - Add aria-label to host and UniFi device suppress buttons in templates - Replace dynamic style color strings in links.html stat cards with TDS utility classes (lt-text-red/green/amber) via downCls/errCls variables Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -17,7 +17,8 @@
|
||||
<div class="lt-toolbar-left">
|
||||
<div class="lt-search">
|
||||
<input type="search" class="lt-input lt-search-input" id="links-search"
|
||||
placeholder="Filter by host or switch name…" autocomplete="off">
|
||||
placeholder="Filter by host or switch name…" autocomplete="off"
|
||||
aria-label="Filter by host or switch name">
|
||||
</div>
|
||||
</div>
|
||||
<div class="lt-toolbar-right">
|
||||
@@ -407,8 +408,8 @@ function buildLinkSummary(hosts, unifiSwitches) {
|
||||
}
|
||||
const allTotal = totalIfaces + swTotal;
|
||||
const allDown = downIfaces + swDown;
|
||||
const downColor = allDown > 0 ? 'var(--red)' : 'var(--green)';
|
||||
const errColor = errIfaces > 0 ? 'var(--amber)' : 'var(--green)';
|
||||
const downCls = allDown > 0 ? 'lt-text-red' : 'lt-text-green';
|
||||
const errCls = errIfaces > 0 ? 'lt-text-amber' : 'lt-text-green';
|
||||
const downCardCls = allDown > 0 ? ' lt-stat-card--alert' : '';
|
||||
const poeCard = totalPoe > 0 ? `
|
||||
<div class="lt-stat-card">
|
||||
@@ -428,16 +429,16 @@ function buildLinkSummary(hosts, unifiSwitches) {
|
||||
</div>
|
||||
</div>
|
||||
<div class="lt-stat-card${downCardCls}">
|
||||
<span class="lt-stat-icon" aria-hidden="true" style="color:${downColor}">●</span>
|
||||
<span class="lt-stat-icon ${downCls}" aria-hidden="true">●</span>
|
||||
<div class="lt-stat-info">
|
||||
<span class="lt-stat-value" style="color:${downColor}">${allDown}</span>
|
||||
<span class="lt-stat-value ${downCls}">${allDown}</span>
|
||||
<span class="lt-stat-label">Ports Down</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="lt-stat-card">
|
||||
<span class="lt-stat-icon" aria-hidden="true" style="color:${errColor}">▲</span>
|
||||
<span class="lt-stat-icon ${errCls}" aria-hidden="true">▲</span>
|
||||
<div class="lt-stat-info">
|
||||
<span class="lt-stat-value" style="color:${errColor}">${errIfaces}</span>
|
||||
<span class="lt-stat-value ${errCls}">${errIfaces}</span>
|
||||
<span class="lt-stat-label">With Errors</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user