Mirror/intercept
1
0
Fork 0
mirror of https://github.com/smittix/intercept.git synced 2026-04-24 06:40:00 -07:00
Code Issues Packages Projects Releases Wiki Activity

fix: replace 100+ hardcoded colors with CSS variables for light theme

Browse Source 
Add theme-aware severity/neon CSS variables and replace hardcoded hex
colors (#fff, #000, #00ff88, #ffcc00, etc.) with var() references
across 26 files so text remains readable in both dark and light themes.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Smittix
2026-03-03 11:35:17 +00:00
parent f3d475d53a
commit 38644bced6
26 changed files with 4415 additions and 4326 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
static/css/modes/tscm.css
View File

@@ -81,7 +81,7 @@
}
.tscm-panel-header .badge {
background: var(--primary-color);
color: #fff;
color: var(--text-inverse);
padding: 2px 8px;
border-radius: 10px;
font-size: 10px;
@@ -175,7 +175,7 @@
background: var(--accent-green);
border: none;
border-radius: 4px;
color: #000;
color: var(--text-inverse);
font-size: 12px;
font-weight: 600;
cursor: pointer;
@@ -411,7 +411,7 @@
.tscm-modal-close:hover {
background: var(--accent-red);
border-color: var(--accent-red);
color: #fff;
color: var(--text-inverse);
}
.device-detail-header {
padding: 16px;
@@ -654,10 +654,10 @@
border-radius: 3px;
text-transform: uppercase;
}
.tscm-threat-item.critical .tscm-threat-severity { background: #ff3366; color: #fff; }
.tscm-threat-item.high .tscm-threat-severity { background: #ff9933; color: #000; }
.tscm-threat-item.medium .tscm-threat-severity { background: #ffcc00; color: #000; }
.tscm-threat-item.low .tscm-threat-severity { background: #00ff88; color: #000; }
.tscm-threat-item.critical .tscm-threat-severity { background: var(--severity-critical); color: var(--text-inverse); }
.tscm-threat-item.high .tscm-threat-severity { background: var(--severity-high); color: var(--text-inverse); }
.tscm-threat-item.medium .tscm-threat-severity { background: var(--severity-medium); color: var(--text-inverse); }
.tscm-threat-item.low .tscm-threat-severity { background: var(--severity-low); color: var(--text-inverse); }
.tscm-threat-details {
font-size: 11px;
color: var(--text-muted);
@@ -1691,3 +1691,45 @@
flex-wrap: wrap;
margin-top: 6px;
}
/* Light theme overrides */
[data-theme="light"] .threat-card.critical { border-color: var(--severity-critical); color: var(--severity-critical); }
[data-theme="light"] .threat-card.high { border-color: var(--severity-high); color: var(--severity-high); }
[data-theme="light"] .threat-card.medium { border-color: var(--severity-medium); color: var(--severity-medium); }
[data-theme="light"] .threat-card.low { border-color: var(--severity-low); color: var(--severity-low); }
[data-theme="light"] .tscm-threat-item.critical { border-color: var(--severity-critical); }
[data-theme="light"] .tscm-threat-item.high { border-color: var(--severity-high); }
[data-theme="light"] .tscm-threat-item.medium { border-color: var(--severity-medium); }
[data-theme="light"] .tscm-threat-item.low { border-color: var(--severity-low); }
[data-theme="light"] .score-badge.score-high { color: #cc2222; }
[data-theme="light"] .score-badge.score-medium { color: #9a8420; }
[data-theme="light"] .score-badge.score-low { color: #1a8a50; }
[data-theme="light"] .score-circle.high { border-color: #cc2222; }
[data-theme="light"] .score-circle.medium { border-color: #9a8420; }
[data-theme="light"] .score-circle.low { border-color: #1a8a50; }
[data-theme="light"] .score-circle.high .score-value { color: #cc2222; }
[data-theme="light"] .score-circle.medium .score-value { color: #9a8420; }
[data-theme="light"] .score-circle.low .score-value { color: #1a8a50; }
[data-theme="light"] .cap-status.available { color: #1a8a50; }
[data-theme="light"] .cap-status.limited { color: #9a8420; }
[data-theme="light"] .cap-status.unavailable { color: #cc2222; }
[data-theme="light"] .cap-detail-status.available { color: #1a8a50; }
[data-theme="light"] .cap-detail-status.limited { color: #9a8420; }
[data-theme="light"] .cap-detail-status.unavailable { color: #cc2222; }
[data-theme="light"] .health-badge.healthy { color: #1a8a50; }
[data-theme="light"] .health-badge.noisy { color: #9a8420; }
[data-theme="light"] .health-badge.stale { color: #cc2222; }
[data-theme="light"] .tscm-assessment.high-interest { color: #cc2222; border-color: #cc2222; }
[data-theme="light"] .tscm-assessment.needs-review { color: #9a8420; border-color: #9a8420; }
[data-theme="light"] .tscm-assessment.informational { color: #1a8a50; border-color: #1a8a50; }
[data-theme="light"] .summary-stat.high-interest .count { color: #cc2222; }
[data-theme="light"] .summary-stat.needs-review .count { color: #9a8420; }
[data-theme="light"] .summary-stat.informational .count { color: #1a8a50; }
[data-theme="light"] .known-badge { color: #1a8a50; }
[data-theme="light"] .tracker-badge { color: #cc2244; }
[data-theme="light"] .tscm-correlations { border-color: var(--accent-orange); }
[data-theme="light"] .tscm-correlations h4 { color: var(--accent-orange); }
[data-theme="light"] .case-status.open { color: #1a8a50; }
[data-theme="light"] .playbook-risk.high_interest { color: #cc2222; }
[data-theme="light"] .playbook-risk.needs_review { color: #9a8420; }
[data-theme="light"] .playbook-risk.informational { color: #1a8a50; }