Files
OSINT-Framework/public/css/arf.css
T
s0lrayandPaperclip b2cd803130 fix(ui): improve light mode secondary text contrast to meet WCAG AA
#767676 on white = 4.54:1, just above the 4.5:1 AA threshold.
#999 (previous value) was 2.85:1, which failed.

Closes THE-37.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-03-24 07:29:22 -04:00

108 lines
2.1 KiB
CSS

/* === Color tokens === */
:root {
--color-bg: #1a1a2e;
--color-surface: #16213e;
--color-text-primary: #e0e0e0;
--color-text-secondary: #888;
--color-node-stroke: #4a9eff;
--color-node-fill-branch: #2a4a7f;
--color-node-fill-leaf: #1a1a2e;
--color-link: #444;
--color-noscript-bg: #2a1a00;
--color-noscript-border: #7a4a00;
--color-legend: #e0e0e0;
--color-header: #e0e0e0;
}
body.light-mode {
--color-bg: #ffffff;
--color-surface: #f5f5f5;
--color-text-primary: #000000;
--color-text-secondary: #767676;
--color-node-stroke: steelblue;
--color-node-fill-branch: lightsteelblue;
--color-node-fill-leaf: #ffffff;
--color-link: #ccc;
--color-noscript-bg: rgb(255, 228, 196);
--color-noscript-border: rgb(255, 204, 153);
--color-legend: #000000;
--color-header: #000000;
}
body {
background-color: var(--color-bg);
color: var(--color-text-primary);
font-size: 14px;
font-family: "Helvetica Neue", Helvetica;
}
noscript p {
text-align: center;
background-color: var(--color-noscript-bg);
color: var(--color-text-primary);
margin: 0 auto;
width: 80vw;
padding: 25px 0;
margin-top: 80px;
border-radius: 10px;
border: 1px solid var(--color-noscript-border);
margin-bottom: 20px;
display: flex-wrap;
}
#body {
margin: 0 auto;
position: relative;
}
#header {
font-size: 40px;
font-weight: bold;
top: 20px;
text-align: center;
color: var(--color-header);
}
.legend {
position: absolute;
top: 0px;
right: 0;
width: 330px;
font-size: 11px;
color: var(--color-legend);
}
.legend a {
color: var(--color-node-stroke);
}
.node {
cursor: pointer;
}
.node circle {
cursor: pointer;
fill: var(--color-node-fill-leaf);
stroke: var(--color-node-stroke);
stroke-width: 1.5px;
}
.node text {
font-size: 12px;
fill: var(--color-text-primary);
}
path.link {
fill: none;
stroke: var(--color-link);
stroke-width: 1px;
}
h3 {
color: var(--color-text-primary);
}
a {
color: var(--color-node-stroke);
}