Fix: packet type colors update badges in real-time

Badge classes (.badge-advert etc.) use hardcoded CSS colors.
Now injects a <style> element with color overrides derived from
TYPE_COLORS on every theme preview update.
This commit is contained in:
you
2026-03-23 02:23:12 +00:00
parent f2c6186d8c
commit 918589fc8c
2 changed files with 23 additions and 1 deletions
+22
View File
@@ -237,6 +237,28 @@
void nav.offsetHeight;
nav.style.background = '';
}
// Inject type color overrides for badges
applyTypeColorCSS();
}
let typeColorStyleEl = null;
function applyTypeColorCSS() {
if (!typeColorStyleEl) {
typeColorStyleEl = document.createElement('style');
typeColorStyleEl.id = 'cust-type-colors';
document.head.appendChild(typeColorStyleEl);
}
var tc = state.typeColors || {};
var map = { ADVERT: 'advert', GRP_TXT: 'grp-txt', TXT_MSG: 'txt-msg', ACK: 'ack', REQUEST: 'req', RESPONSE: 'response', TRACE: 'trace', PATH: 'path' };
var css = '';
for (var type in map) {
if (tc[type]) {
var cls = map[type];
css += '.badge-' + cls + ' { background: ' + tc[type] + '22; color: ' + tc[type] + '; }\n';
css += '[data-theme="dark"] .badge-' + cls + ' { background: ' + tc[type] + '33; color: ' + tc[type] + '; }\n';
}
}
typeColorStyleEl.textContent = css;
}
function resetPreview() {
+1 -1
View File
@@ -101,6 +101,6 @@
<script src="observer-detail.js?v=1774219440" onerror="console.error('Failed to load:', this.src)"></script>
<script src="node-analytics.js?v=1774126708" onerror="console.error('Failed to load:', this.src)"></script>
<script src="perf.js?v=1773985649" onerror="console.error('Failed to load:', this.src)"></script>
<script src="customize.js?v=1774232523" onerror="console.error('Failed to load:', this.src)"></script>
<script src="customize.js?v=1774232592" onerror="console.error('Failed to load:', this.src)"></script>
</body>
</html>