Files
cve/docs/style.css
T
0xMarcio 35cb1e6962 Index nuclei templates as PoCs and take their ratings with them
A nuclei template is a runnable check for one CVE, which makes it a proof of
concept whether or not anyone published a repository for it. Measured against
the index: 3,952 CVEs gain a template link and 858 of those had no PoC at all,
584 of the additions falling in 2024 or later. That last figure is the point.
ExploitDB carries more CVEs overall and Metasploit is better weaponised, but
both skew historical; nuclei is where coverage of a recent CVE actually shows
up first.

Templates also carry the ratings the entries never had. Severity, CVSS with
its vector, EPSS with its percentile and CWE now sit in nuclei.json for the
site to read: 4,193 of 4,418 templates state a CVSS score and 4,274 an EPSS
score. A result can finally say how bad a flaw is and how likely it is to be
used, rather than only that somebody wrote code for it.

Templates are kept in their own section and their own field. They are not
somebody's repository and should not be ranked, starred or credited as one,
but they do lead the PoC list, being the one link that runs as it stands.

The index files are also revalidated rather than reused from cache. They are
rebuilt hourly and a returning visitor was holding whatever it downloaded
first, which cost a stale index here until the copy was thrown away by hand.
2026-09-01 05:11:31 +02:00

404 lines
11 KiB
CSS

/* CVE PoC Hub. GitHub Primer dark_default tokens, per the refit handoff. */
:root {
--canvas: #0d1117;
--canvas-subtle: #161b22;
--border: #30363d;
--border-muted: #21262d;
--fg: #e6edf3;
--fg-subtle: #c9d1d9;
--fg-muted: #9198a1;
--neutral: #7d8590;
--accent: #58a6ff;
--accent-hover: #79c0ff;
--accent-emphasis: #1f6feb;
--attention: #e3b341;
--danger: #f85149;
--mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
--sans: 'Space Grotesk', system-ui, -apple-system, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
* { scrollbar-width: thin; scrollbar-color: var(--border) transparent; }
html, body { margin: 0; padding: 0; background: var(--canvas); min-height: 100%; }
body {
font-family: var(--sans);
-webkit-font-smoothing: antialiased;
display: flex;
flex-direction: column;
min-height: 100vh;
}
a { color: var(--accent); text-decoration: none; }
a:hover { color: var(--accent-hover); }
:focus-visible { outline: 2px solid var(--accent-emphasis); outline-offset: 2px; border-radius: 2px; }
[hidden] { display: none !important; }
.container { max-width: 1240px; width: 100%; margin: 0 auto; padding: 0 32px; }
/* ---- hero, the same card the README banner draws ------------------------ */
.hero-bar { padding-top: 30px; }
.hero {
position: relative;
overflow: hidden;
display: flex;
align-items: center;
justify-content: space-between;
gap: 32px;
flex-wrap: wrap;
padding: 26px 28px;
background: var(--canvas-subtle);
border: 1px solid var(--border);
border-radius: 6px;
}
.hero-radar {
position: absolute;
right: -40px;
top: 50%;
width: 300px;
height: 300px;
transform: translateY(-50%);
pointer-events: none;
opacity: .5;
}
.hero-radar circle { fill: none; stroke: var(--accent-emphasis); stroke-width: 2; opacity: .35; }
.hero-radar .hero-sweep {
stroke: var(--accent);
stroke-width: 3;
stroke-linecap: round;
opacity: .55;
transform-origin: 200px 200px;
animation: hero-sweep 8s linear infinite;
}
@keyframes hero-sweep { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
.hero-radar .hero-sweep { animation: none; }
}
.hero-id { position: relative; min-width: 0; }
.hero-id h1 {
margin: 0;
font: 700 34px/1 var(--mono);
letter-spacing: .06em;
color: var(--fg);
}
.hero-id p {
margin: 12px 0 0;
font: 400 13.5px/1 var(--mono);
color: var(--fg-muted);
}
.hero-stats { position: relative; display: flex; gap: 44px; margin: 0; flex-wrap: wrap; }
.hero-stats dt {
font: 700 27px/1 var(--mono);
letter-spacing: -.02em;
color: var(--fg);
font-variant-numeric: tabular-nums;
}
.hero-stats dt.is-accent { color: var(--accent); }
.hero-stats dt.is-danger { color: var(--danger); }
.hero-stats dd {
margin: 8px 0 0;
font: 500 10px/1 var(--mono);
letter-spacing: .12em;
color: var(--neutral);
}
/* ---- search ------------------------------------------------------------- */
.search-bar { padding-top: 18px; }
.search {
display: flex;
align-items: center;
gap: 13px;
height: 52px;
padding: 0 17px;
background: var(--canvas-subtle);
border: 1px solid var(--border);
border-radius: 6px;
}
.search:focus-within { border-color: var(--accent-emphasis); }
.search svg { flex: none; display: block; }
.search input {
flex: 1;
min-width: 0;
background: transparent;
border: 0;
outline: 0;
padding: 0;
font: 400 15px/1 var(--mono);
color: var(--fg);
}
.search input::placeholder { color: var(--neutral); }
.search-status {
flex: none;
white-space: nowrap;
font: 400 11.5px/1 var(--mono);
color: var(--fg-muted);
}
.content { flex: 1; padding-top: 26px; padding-bottom: 48px; }
/* ---- shared table shell ------------------------------------------------- */
.panel { border: 1px solid var(--border); border-radius: 6px; overflow: hidden; }
.panel-head {
display: flex;
align-items: baseline;
gap: 10px;
padding: 13px 16px;
border-bottom: 1px solid var(--border);
}
.panel-head h2 {
flex: none;
margin: 0;
font: 600 14px/1 var(--sans);
letter-spacing: -.01em;
color: var(--fg);
}
.panel-count {
flex: none;
white-space: nowrap;
font: 400 11.5px/1 var(--mono);
color: var(--fg-muted);
}
.col-head {
display: grid;
padding: 8px 16px;
background: var(--canvas-subtle);
border-bottom: 1px solid var(--border);
font: 500 10.5px/1 var(--mono);
letter-spacing: .1em;
color: var(--fg-muted);
}
/* ---- state A: results --------------------------------------------------- */
.results .col-head, .result-row { grid-template-columns: 196px minmax(0, 1fr); }
.result-row { display: grid; border-bottom: 1px solid var(--border-muted); }
.result-row:last-child { border-bottom: 0; }
.result-meta { padding: 16px; border-right: 1px solid var(--border-muted); }
.result-id { font: 500 13.5px/1.2 var(--mono); letter-spacing: -.01em; }
.result-pocs { margin-top: 8px; font: 400 11.5px/1 var(--mono); color: var(--fg-muted); }
.result-dates {
margin: 12px 0 0;
display: flex;
flex-direction: column;
gap: 4px;
font: 400 11px/1.4 var(--mono);
color: var(--fg-muted);
}
.chips { margin-top: 13px; display: flex; gap: 6px; flex-wrap: wrap; }
.chip {
font: 400 11px/1 var(--mono);
letter-spacing: .06em;
color: var(--fg-muted);
border: 1px solid var(--border);
border-radius: 4px;
padding: 5px 8px;
}
a.chip:hover { color: var(--fg); border-color: var(--fg-muted); }
.chip-kev {
font-weight: 500;
color: var(--danger);
background: rgba(248, 81, 73, .1);
border-color: rgba(248, 81, 73, .4);
}
.chip-sev { font-weight: 500; letter-spacing: .08em; }
.chip-sev.is-critical { color: #ff7b72; border-color: rgba(255, 123, 114, .45); background: rgba(255, 123, 114, .1); }
.chip-sev.is-high { color: #f0883e; border-color: rgba(240, 136, 62, .45); background: rgba(240, 136, 62, .1); }
.chip-sev.is-medium { color: var(--attention); border-color: rgba(227, 179, 65, .4); background: rgba(227, 179, 65, .1); }
.chip-sev.is-low { color: var(--fg-muted); }
.chip-epss { color: var(--fg-subtle); font-variant-numeric: tabular-nums; }
.result-body { padding: 16px; min-width: 0; }
.result-desc {
margin: 0;
max-width: 96ch;
font: 400 13.5px/1.6 var(--sans);
color: var(--fg-subtle);
max-height: 3.2em;
overflow: hidden;
text-wrap: pretty;
}
.result-desc.is-open { max-height: none; }
.expander {
margin-top: 8px;
background: transparent;
border: 0;
padding: 0;
cursor: pointer;
font: 400 11px/1 var(--mono);
color: var(--accent);
}
.expander:hover { color: var(--accent-hover); }
.poc-list { margin-top: 14px; border-top: 1px solid var(--border-muted); }
.poc-row {
display: grid;
grid-template-columns: minmax(0, 1fr) 78px 52px;
gap: 14px;
align-items: center;
padding: 9px 0;
border-bottom: 1px solid var(--border-muted);
}
.poc-name {
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font: 400 12.5px/1 var(--mono);
color: var(--fg-muted);
}
.poc-sep { color: var(--neutral); }
.poc-name a { color: var(--fg); font-weight: 500; }
.poc-name a:hover { color: var(--accent); }
.poc-name a.plain { color: var(--fg-muted); font-weight: 400; }
.poc-tag {
margin-right: 7px;
padding: 2px 5px;
border-radius: 3px;
font: 600 9px/1 var(--mono);
letter-spacing: .08em;
color: #a5d6ff;
background: rgba(56, 139, 253, .12);
border: 1px solid rgba(56, 139, 253, .4);
}
.poc-name a.plain:hover { color: var(--accent); }
.poc-stars { text-align: right; font: 400 12px/1 var(--mono); color: var(--fg-muted); }
.poc-stars.is-popular { color: var(--attention); }
.star { color: var(--neutral); }
.poc-age { text-align: right; font: 400 11.5px/1 var(--mono); color: var(--fg-muted); }
.poc-more {
display: block;
width: 100%;
text-align: left;
background: transparent;
border: 0;
padding: 9px 0 0;
cursor: pointer;
font: 400 11px/1 var(--mono);
color: var(--fg-muted);
}
.poc-more:hover { color: var(--accent); }
/* ---- state B: nothing matched ------------------------------------------- */
.empty {
padding: 44px 16px;
text-align: center;
font: 400 13px/1 var(--mono);
color: var(--fg-muted);
}
/* ---- state C: trending -------------------------------------------------- */
.trend-controls {
display: flex;
align-items: center;
gap: 14px;
flex-wrap: wrap;
margin-bottom: 14px;
}
.switch { display: flex; border: 1px solid var(--border); border-radius: 4px; overflow: hidden; }
.switch button {
border: 0;
padding: 7px 12px;
cursor: pointer;
font: 500 10.5px/1 var(--mono);
letter-spacing: .06em;
background: transparent;
color: var(--fg-muted);
}
.switch button[aria-pressed="true"] { background: var(--accent-emphasis); color: #ffffff; }
.trend-note {
flex: none;
white-space: nowrap;
font: 400 11.5px/1 var(--mono);
color: var(--fg-muted);
}
.trending .col-head, .trend-row {
grid-template-columns: 74px 96px 300px minmax(0, 1fr);
gap: 18px;
}
.trend-row {
display: grid;
align-items: center;
padding: 10px 16px;
border-bottom: 1px solid var(--border-muted);
}
.trend-row:last-child { border-bottom: 0; }
.trend-row:hover { background: var(--canvas-subtle); }
.col-stars { text-align: right; }
.trend-stars {
text-align: right;
white-space: nowrap;
font: 500 12.5px/1 var(--mono);
color: var(--fg-muted);
}
.trend-stars.is-popular { color: var(--attention); }
.trend-age { white-space: nowrap; font: 400 12px/1 var(--mono); color: var(--fg-muted); }
.trend-kev {
display: inline-block;
margin-right: 7px;
padding: 2px 5px;
border-radius: 3px;
vertical-align: 1px;
font: 600 9px/1 var(--mono);
letter-spacing: .08em;
color: var(--danger);
background: rgba(248, 81, 73, .12);
border: 1px solid rgba(248, 81, 73, .4);
}
.trend-name-cell {
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.trend-name { font: 500 12.5px/1 var(--mono); }
.trend-desc {
font: 400 13px/1.4 var(--sans);
color: var(--fg-subtle);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/* ---- footer ------------------------------------------------------------- */
.site-footer { border-top: 1px solid var(--border-muted); padding: 14px 0; }
.site-footer .container {
display: flex;
gap: 20px;
flex-wrap: wrap;
font: 400 11px/1.6 var(--mono);
color: var(--fg-muted);
}
.site-footer span:last-child { margin-left: auto; }
/* ---- narrow viewports --------------------------------------------------- */
@media (max-width: 900px) {
.container { padding: 0 16px; }
.hero { gap: 22px; padding: 22px; }
.hero-radar { display: none; }
.hero-id h1 { font-size: 27px; }
.hero-stats { gap: 28px; }
.hero-stats dt { font-size: 22px; }
.results .col-head { display: none; }
.result-row { grid-template-columns: 1fr; }
.result-meta { border-right: 0; border-bottom: 1px solid var(--border-muted); }
.trending .col-head, .trend-row { grid-template-columns: 70px 92px minmax(0, 1fr); }
.col-desc, .trend-desc { display: none; }
}
@media (max-width: 620px) {
.trending .col-head, .trend-row { grid-template-columns: 66px minmax(0, 1fr); }
.col-updated, .trend-age { display: none; }
.search-status { display: none; }
}