mirror of
https://github.com/Kpa-clawbot/meshcore-analyzer.git
synced 2026-03-29 10:50:17 +00:00
fix: version-badge link contrast in nav stats bar
Style .version-badge anchor elements to use --nav-text-muted color instead of browser-default blue. Adds hover state using --nav-text. Works with both light and dark themes via existing CSS variables. fixes #139 Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
@@ -22,9 +22,9 @@
|
||||
<meta name="twitter:title" content="MeshCore Analyzer">
|
||||
<meta name="twitter:description" content="Real-time MeshCore LoRa mesh network analyzer — live packet visualization, node tracking, channel decryption, and route analysis.">
|
||||
<meta name="twitter:image" content="https://raw.githubusercontent.com/Kpa-clawbot/meshcore-analyzer/master/public/og-image.png">
|
||||
<link rel="stylesheet" href="style.css?v=1774630476">
|
||||
<link rel="stylesheet" href="home.css?v=1774630476">
|
||||
<link rel="stylesheet" href="live.css?v=1774630476">
|
||||
<link rel="stylesheet" href="style.css?v=1774631638">
|
||||
<link rel="stylesheet" href="home.css?v=1774631638">
|
||||
<link rel="stylesheet" href="live.css?v=1774631638">
|
||||
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"
|
||||
integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY="
|
||||
crossorigin="anonymous">
|
||||
@@ -81,29 +81,29 @@
|
||||
<main id="app" role="main"></main>
|
||||
|
||||
<script src="vendor/qrcode.js"></script>
|
||||
<script src="roles.js?v=1774630476"></script>
|
||||
<script src="customize.js?v=1774630476" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="region-filter.js?v=1774630476"></script>
|
||||
<script src="hop-resolver.js?v=1774630476"></script>
|
||||
<script src="hop-display.js?v=1774630476"></script>
|
||||
<script src="app.js?v=1774630476"></script>
|
||||
<script src="home.js?v=1774630476"></script>
|
||||
<script src="packet-filter.js?v=1774630476"></script>
|
||||
<script src="packets.js?v=1774630476"></script>
|
||||
<script src="map.js?v=1774630476" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="channels.js?v=1774630476" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="nodes.js?v=1774630476" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="traces.js?v=1774630476" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="analytics.js?v=1774630476" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="audio.js?v=1774630476" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="audio-v1-constellation.js?v=1774630476" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="audio-v2-constellation.js?v=1774630476" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="audio-lab.js?v=1774630476" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="live.js?v=1774630476" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="observers.js?v=1774630476" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="observer-detail.js?v=1774630476" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="compare.js?v=1774630476" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="node-analytics.js?v=1774630476" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="perf.js?v=1774630476" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="roles.js?v=1774631638"></script>
|
||||
<script src="customize.js?v=1774631638" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="region-filter.js?v=1774631638"></script>
|
||||
<script src="hop-resolver.js?v=1774631638"></script>
|
||||
<script src="hop-display.js?v=1774631638"></script>
|
||||
<script src="app.js?v=1774631638"></script>
|
||||
<script src="home.js?v=1774631638"></script>
|
||||
<script src="packet-filter.js?v=1774631638"></script>
|
||||
<script src="packets.js?v=1774631638"></script>
|
||||
<script src="map.js?v=1774631638" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="channels.js?v=1774631638" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="nodes.js?v=1774631638" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="traces.js?v=1774631638" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="analytics.js?v=1774631638" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="audio.js?v=1774631638" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="audio-v1-constellation.js?v=1774631638" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="audio-v2-constellation.js?v=1774631638" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="audio-lab.js?v=1774631638" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="live.js?v=1774631638" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="observers.js?v=1774631638" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="observer-detail.js?v=1774631638" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="compare.js?v=1774631638" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="node-analytics.js?v=1774631638" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="perf.js?v=1774631638" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -171,6 +171,12 @@ a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible
|
||||
padding: 1px 5px; border-radius: var(--badge-radius);
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
.nav-stats .version-badge a {
|
||||
color: var(--nav-text-muted); text-decoration: none;
|
||||
}
|
||||
.nav-stats .version-badge a:hover {
|
||||
color: var(--nav-text); text-decoration: underline;
|
||||
}
|
||||
|
||||
/* === Layout === */
|
||||
#app { height: calc(100vh - 52px); height: calc(100dvh - 52px); overflow: hidden; }
|
||||
|
||||
@@ -1271,6 +1271,22 @@ console.log('\n=== app.js: formatVersionBadge ===');
|
||||
});
|
||||
}
|
||||
|
||||
// ===== CSS: version-badge link contrast (issue #139) =====
|
||||
console.log('\n=== style.css: version-badge link contrast ===');
|
||||
{
|
||||
const cssContent = fs.readFileSync(__dirname + '/public/style.css', 'utf8');
|
||||
test('version-badge a has explicit color', () => {
|
||||
assert.ok(cssContent.includes('.version-badge a'), 'should have .version-badge a rule');
|
||||
assert.ok(/\.version-badge a\s*\{[^}]*color:\s*var\(--nav-text-muted\)/.test(cssContent),
|
||||
'link color should use var(--nav-text-muted)');
|
||||
});
|
||||
test('version-badge a has hover state', () => {
|
||||
assert.ok(cssContent.includes('.version-badge a:hover'), 'should have .version-badge a:hover rule');
|
||||
assert.ok(/\.version-badge a:hover\s*\{[^}]*color:\s*var\(--nav-text\)/.test(cssContent),
|
||||
'hover color should use var(--nav-text)');
|
||||
});
|
||||
}
|
||||
|
||||
// ===== SUMMARY =====
|
||||
console.log(`\n${'═'.repeat(40)}`);
|
||||
console.log(` Frontend helpers: ${passed} passed, ${failed} failed`);
|
||||
|
||||
Reference in New Issue
Block a user