CSS: migrate links.html static inline styles to classes
Lint / Python (flake8) (push) Successful in 41s
Lint / JS (eslint) (push) Successful in 7s
Security / Python Security (bandit) (push) Successful in 40s
Test / Python Tests (pytest) (push) Successful in 48s
Lint / Notify on failure (push) Has been skipped
Lint / Deploy (push) Successful in 4s
Lint / Python (flake8) (push) Successful in 41s
Lint / JS (eslint) (push) Successful in 7s
Security / Python Security (bandit) (push) Successful in 40s
Test / Python Tests (pytest) (push) Successful in 48s
Lint / Notify on failure (push) Has been skipped
Lint / Deploy (push) Successful in 4s
- lt-divider--unifi / lt-divider-label--unifi: replace hardcoded margin and cyan label color on the UniFi switch section divider - lt-text-amber / lt-text-cyan on stat card icons and values (matches same migration done in index.html) - lt-stats-grid--mb: margin-bottom:16px on the summary stats grid - g-page-sub-aside: replaces margin-left:8px on the updated timestamp span in links and inspector page subtitle Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
+7
-1
@@ -143,8 +143,13 @@
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* ── Divider compact variant ─────────────────────────────────────── */
|
||||
/* ── Divider variants ────────────────────────────────────────────── */
|
||||
.lt-divider--compact { margin: 1rem 0 0.75rem; }
|
||||
.lt-divider--unifi { margin: 20px 0 12px; }
|
||||
.lt-divider-label--unifi { color: var(--cyan); letter-spacing: .1em; }
|
||||
|
||||
/* ── Stats grid spacing variant ──────────────────────────────────── */
|
||||
.lt-stats-grid--mb { margin-bottom: 16px; }
|
||||
|
||||
/* ── Topology section collapse toggle ────────────────────────────── */
|
||||
.topo-collapse-btn {
|
||||
@@ -213,6 +218,7 @@
|
||||
.events-filter-bar .lt-input-sm { width: 220px; }
|
||||
.sev-pills { display: flex; gap: 4px; }
|
||||
.g-page-sub { font-size: .78em; color: var(--text-muted); margin-top: 4px; }
|
||||
.g-page-sub-aside { font-size: .78em; color: var(--text-muted); margin-left: 8px; }
|
||||
|
||||
/* ── Badge severity color variants (used with lt-badge) ───────────── */
|
||||
.badge-critical { color: var(--red); border-color: var(--red); text-shadow: var(--glow-red); }
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
<h1 class="lt-page-title">Network Inspector</h1>
|
||||
<p class="g-page-sub">
|
||||
Visual switch chassis diagrams. Click a port to see detailed stats and LLDP path debug.
|
||||
<span id="inspector-updated" style="margin-left:8px"></span>
|
||||
<span id="inspector-updated" class="g-page-sub-aside"></span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
<h1 class="lt-page-title">Link Debug</h1>
|
||||
<p class="g-page-sub">
|
||||
Per-interface stats: speed, duplex, SFP optical levels, TX/RX rates, errors, and carrier changes.
|
||||
<span id="links-updated" style="margin-left:8px"></span>
|
||||
<span id="links-updated" class="g-page-sub-aside"></span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -358,7 +358,7 @@ function renderUnifiSwitches(unifiSwitches, dataUpdated) {
|
||||
</div>`;
|
||||
}).join('');
|
||||
|
||||
return `<div class="lt-divider" style="margin:20px 0 12px"><span class="lt-divider-label" style="color:var(--cyan);letter-spacing:.1em">UNIFI SWITCH PORTS</span></div>${html}`;
|
||||
return `<div class="lt-divider lt-divider--unifi"><span class="lt-divider-label lt-divider-label--unifi">UNIFI SWITCH PORTS</span></div>${html}`;
|
||||
}
|
||||
|
||||
// ── Panel collapse / expand ───────────────────────────────────────
|
||||
@@ -412,18 +412,18 @@ function buildLinkSummary(hosts, unifiSwitches) {
|
||||
const downCardCls = allDown > 0 ? ' lt-stat-card--alert' : '';
|
||||
const poeCard = totalPoe > 0 ? `
|
||||
<div class="lt-stat-card">
|
||||
<span class="lt-stat-icon" aria-hidden="true" style="color:var(--amber)">⚡</span>
|
||||
<span class="lt-stat-icon lt-text-amber" aria-hidden="true">⚡</span>
|
||||
<div class="lt-stat-info">
|
||||
<span class="lt-stat-value" style="color:var(--amber)">${totalPoe.toFixed(1)}</span>
|
||||
<span class="lt-stat-value lt-text-amber">${totalPoe.toFixed(1)}</span>
|
||||
<span class="lt-stat-label">PoE Load (W)</span>
|
||||
</div>
|
||||
</div>` : '';
|
||||
return `
|
||||
<div class="lt-stats-grid" style="margin-bottom:16px">
|
||||
<div class="lt-stats-grid lt-stats-grid--mb">
|
||||
<div class="lt-stat-card">
|
||||
<span class="lt-stat-icon" aria-hidden="true" style="color:var(--cyan)">⬡</span>
|
||||
<span class="lt-stat-icon lt-text-cyan" aria-hidden="true">⬡</span>
|
||||
<div class="lt-stat-info">
|
||||
<span class="lt-stat-value" style="color:var(--cyan)">${allTotal}</span>
|
||||
<span class="lt-stat-value lt-text-cyan">${allTotal}</span>
|
||||
<span class="lt-stat-label">Interfaces</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user