mirror of
https://github.com/AnLoMinus/Diablo.git
synced 2026-02-12 14:02:47 +00:00
Add standalone guidance pages and update navigation
This commit is contained in:
⚜️ A̍ͭͩnLͭ̇̎̏̒oͩM̳͇i͎̞̝̪n̹̘̓ͣ̓͊̓ů͕̈s̙͉͎̫̈̌̇̐̂ ⚜️
parent
dd155b7e8d
commit
e694e9dc5f
257
index.html
257
index.html
@@ -6,6 +6,11 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta name="description" content="Diablo ~ Pentesting / Hacking & Reporting Tool by AnLoMinus. Automate recon, organize pentest flows, and generate Markdown reports. Ethical use only." />
|
||||
<meta name="theme-color" content="#ff0033" />
|
||||
<meta property="og:title" content="Diablo · Pentesting / Hacking & Reporting" />
|
||||
<meta property="og:description" content="Automate recon, organize pentest flows, and generate Markdown reports with Diablo." />
|
||||
<meta property="og:image" content="https://user-images.githubusercontent.com/51442719/170010336-39176f7e-b5dc-4f31-81ca-4b4144e6938c.png" />
|
||||
<meta property="og:type" content="website" />
|
||||
<meta property="og:url" content="https://github.com/Anlominus/Diablo" />
|
||||
<style>
|
||||
:root {
|
||||
--bg: #05020a;
|
||||
@@ -45,6 +50,27 @@
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.skip-link {
|
||||
position: absolute;
|
||||
left: -999px;
|
||||
top: 0.5rem;
|
||||
padding: 0.5rem 0.9rem;
|
||||
background: #0f0a1c;
|
||||
border-radius: var(--radius-md);
|
||||
border: 1px solid var(--border);
|
||||
box-shadow: var(--shadow-soft);
|
||||
color: var(--text);
|
||||
text-decoration: none;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.skip-link:focus,
|
||||
.skip-link:focus-visible {
|
||||
left: 1rem;
|
||||
outline: 2px solid var(--accent-2);
|
||||
outline-offset: 3px;
|
||||
}
|
||||
|
||||
/* Subtle noise / scanline overlay */
|
||||
body::before {
|
||||
content: "";
|
||||
@@ -534,6 +560,77 @@
|
||||
margin-bottom: 0.15rem;
|
||||
}
|
||||
|
||||
.note-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.note-card {
|
||||
background: var(--card-bg);
|
||||
border-radius: var(--radius-md);
|
||||
border: 1px solid var(--border);
|
||||
padding: 1rem;
|
||||
box-shadow: var(--shadow-soft);
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.note-card::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: radial-gradient(circle at 20% 15%, var(--accent-soft), transparent 65%);
|
||||
opacity: 0.7;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.note-title {
|
||||
margin: 0 0 0.4rem;
|
||||
font-size: 1rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.4rem;
|
||||
}
|
||||
|
||||
.note-title span.icon {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.note-body {
|
||||
color: var(--muted);
|
||||
font-size: 0.9rem;
|
||||
margin: 0 0 0.7rem;
|
||||
}
|
||||
|
||||
.checklist {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
display: grid;
|
||||
gap: 0.45rem;
|
||||
}
|
||||
|
||||
.checklist-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.55rem;
|
||||
font-size: 0.9rem;
|
||||
color: var(--muted);
|
||||
}
|
||||
|
||||
.status-dot {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
box-shadow: 0 0 14px rgba(255, 0, 51, 0.35);
|
||||
}
|
||||
|
||||
.status-dot.ready { background: #36ff92; box-shadow: 0 0 14px rgba(54,255,146,0.55); }
|
||||
.status-dot.warn { background: #f0c94f; box-shadow: 0 0 14px rgba(240,201,79,0.45); }
|
||||
.status-dot.info { background: #00d1ff; box-shadow: 0 0 14px rgba(0,209,255,0.45); }
|
||||
|
||||
.step-title {
|
||||
font-size: 0.9rem;
|
||||
margin-bottom: 0.3rem;
|
||||
@@ -629,6 +726,35 @@
|
||||
color: var(--accent-2);
|
||||
}
|
||||
|
||||
.back-to-top {
|
||||
position: fixed;
|
||||
right: 1.2rem;
|
||||
bottom: 1.2rem;
|
||||
padding: 0.65rem 0.9rem;
|
||||
border-radius: 999px;
|
||||
border: 1px solid var(--border);
|
||||
background: rgba(5,3,18,0.85);
|
||||
color: var(--muted);
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.4rem;
|
||||
cursor: pointer;
|
||||
box-shadow: var(--shadow-soft);
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
transition: opacity 0.2s ease-out, transform 0.2s ease-out;
|
||||
}
|
||||
|
||||
.back-to-top.visible {
|
||||
opacity: 1;
|
||||
pointer-events: auto;
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.back-to-top span.icon {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
.hero-grid {
|
||||
grid-template-columns: minmax(0,1fr);
|
||||
@@ -645,6 +771,9 @@
|
||||
.split {
|
||||
grid-template-columns: minmax(0,1fr);
|
||||
}
|
||||
.note-grid {
|
||||
grid-template-columns: minmax(0,1fr);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
@@ -662,9 +791,19 @@
|
||||
grid-template-columns: minmax(0,1fr);
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
*, *::before, *::after {
|
||||
animation-duration: 0.01ms !important;
|
||||
animation-iteration-count: 1 !important;
|
||||
transition-duration: 0.01ms !important;
|
||||
scroll-behavior: auto !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<a class="skip-link" href="#main-content">Skip to main content</a>
|
||||
<header class="topbar">
|
||||
<div class="container topbar-inner">
|
||||
<div class="logo-mark">
|
||||
@@ -674,19 +813,24 @@
|
||||
<div class="logo-text-sub">PENTESTING · HACKING · REPORTING</div>
|
||||
</div>
|
||||
</div>
|
||||
<nav class="nav-links">
|
||||
<nav class="nav-links" aria-label="Primary">
|
||||
<a href="#about">About</a>
|
||||
<a href="#features">Features</a>
|
||||
<a href="#install">Install</a>
|
||||
<a href="#usage">Usage</a>
|
||||
<a href="#readiness">Readiness</a>
|
||||
<a href="#docs">Docs</a>
|
||||
<a href="#pages">Pages</a>
|
||||
<a href="playbooks.html">Playbooks</a>
|
||||
<a href="lab-setup.html">Lab Setup</a>
|
||||
<a href="reporting.html">Reporting</a>
|
||||
<a href="#roadmap">Roadmap</a>
|
||||
<a href="#security">Security</a>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<main id="main-content">
|
||||
<!-- HERO -->
|
||||
<section class="section hero" id="top">
|
||||
<div class="container hero-grid">
|
||||
@@ -1058,6 +1202,42 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- READINESS -->
|
||||
<section class="section" id="readiness">
|
||||
<div class="container">
|
||||
<div class="section-header">
|
||||
<div class="section-kicker">✅ Readiness</div>
|
||||
<h2 class="section-title">Pre-flight & Reporting Guardrails</h2>
|
||||
<p class="section-description">
|
||||
Use these quick checks before starting and before handing off any report.
|
||||
They keep engagements traceable, authorized and consistent.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="note-grid">
|
||||
<article class="note-card">
|
||||
<h3 class="note-title"><span class="icon">📝</span> Before You Run Diablo</h3>
|
||||
<p class="note-body">Ensure the environment is safe to touch and every action is approved.</p>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>Authorization and scope are documented.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Network changes are coordinated with owners.</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Fallback contacts are ready if services degrade.</li>
|
||||
</ul>
|
||||
</article>
|
||||
|
||||
<article class="note-card">
|
||||
<h3 class="note-title"><span class="icon">📤</span> Before You Deliver</h3>
|
||||
<p class="note-body">Ship only what is necessary for remediation and learning.</p>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>Sensitive or out-of-scope data removed.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Risks prioritized with actionable fixes.</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Logs archived securely for audit and lessons learned.</li>
|
||||
</ul>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- DOCS & ROADMAP -->
|
||||
<section class="section" id="docs">
|
||||
<div class="container">
|
||||
@@ -1101,6 +1281,55 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- RECOMMENDED PAGES -->
|
||||
<section class="section" id="pages">
|
||||
<div class="container">
|
||||
<div class="section-header">
|
||||
<div class="section-kicker">🧭 Explore</div>
|
||||
<h2 class="section-title">Recommended Pages</h2>
|
||||
<p class="section-description">
|
||||
Jump into focused guides that extend the main landing page. Each page stays lightweight,
|
||||
practical, and ready for real engagements.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="note-grid">
|
||||
<article class="note-card">
|
||||
<h3 class="note-title"><span class="icon">📓</span> Playbooks</h3>
|
||||
<p class="note-body">Phase-by-phase flows for recon, exploitation, and post-engagement cleanup.</p>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>Recon and enumeration jump starts.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Privilege escalation and pivoting notes.</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Containment and cleanup reminders.</li>
|
||||
</ul>
|
||||
<a class="tag" href="playbooks.html">Open Playbooks</a>
|
||||
</article>
|
||||
|
||||
<article class="note-card">
|
||||
<h3 class="note-title"><span class="icon">🧪</span> Lab Setup</h3>
|
||||
<p class="note-body">Reference builds for safe testing spaces and reproducible demos.</p>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>Segmented networks and logging defaults.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Baseline VM / container profiles.</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Patch and rollback routines.</li>
|
||||
</ul>
|
||||
<a class="tag" href="lab-setup.html">Open Lab Setup</a>
|
||||
</article>
|
||||
|
||||
<article class="note-card">
|
||||
<h3 class="note-title"><span class="icon">📝</span> Reporting</h3>
|
||||
<p class="note-body">Templates, tone, and delivery checklists to ship better findings.</p>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>Executive summaries with risk context.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Repro steps with artifacts and commands.</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Hand-off and remediation follow-through.</li>
|
||||
</ul>
|
||||
<a class="tag" href="reporting.html">Open Reporting</a>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- SECURITY -->
|
||||
<section class="section" id="security">
|
||||
<div class="container">
|
||||
@@ -1132,6 +1361,11 @@
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<button class="back-to-top" type="button" aria-label="Back to top">
|
||||
<span class="icon">⬆️</span>
|
||||
<span>Back to top</span>
|
||||
</button>
|
||||
|
||||
<footer class="footer">
|
||||
<div class="container footer-inner">
|
||||
<div>
|
||||
@@ -1145,5 +1379,24 @@
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<script>
|
||||
const backToTop = document.querySelector('.back-to-top');
|
||||
const toggleBackToTop = () => {
|
||||
if (!backToTop) return;
|
||||
if (window.scrollY > 240) {
|
||||
backToTop.classList.add('visible');
|
||||
} else {
|
||||
backToTop.classList.remove('visible');
|
||||
}
|
||||
};
|
||||
|
||||
if (backToTop) {
|
||||
backToTop.addEventListener('click', () => {
|
||||
window.scrollTo({ top: 0, behavior: 'smooth' });
|
||||
});
|
||||
window.addEventListener('scroll', toggleBackToTop);
|
||||
toggleBackToTop();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
255
lab-setup.html
Normal file
255
lab-setup.html
Normal file
@@ -0,0 +1,255 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Diablo · Lab Setup</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta name="description" content="Reference lab setups for Diablo engagements." />
|
||||
<style>
|
||||
:root {
|
||||
--bg: #05020a;
|
||||
--bg-alt: #0a0714;
|
||||
--card-bg: #0f0a1c;
|
||||
--accent: #ff0033;
|
||||
--accent-soft: rgba(255, 0, 80, 0.22);
|
||||
--accent-2: #00ffcc;
|
||||
--text: #f5f5f5;
|
||||
--muted: #a0a0c0;
|
||||
--border: rgba(255, 255, 255, 0.06);
|
||||
--radius-lg: 18px;
|
||||
--radius-md: 12px;
|
||||
--shadow-strong: 0 0 60px rgba(255, 0, 60, 0.35);
|
||||
--shadow-soft: 0 0 35px rgba(0, 255, 204, 0.18);
|
||||
}
|
||||
|
||||
* { box-sizing: border-box; }
|
||||
html, body { margin: 0; padding: 0; scroll-behavior: smooth; }
|
||||
body {
|
||||
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
|
||||
background:
|
||||
radial-gradient(circle at top, #250016 0, transparent 55%),
|
||||
radial-gradient(circle at bottom, #00131a 0, transparent 60%),
|
||||
linear-gradient(135deg, #010007 0, #060313 40%, #050008 100%);
|
||||
color: var(--text);
|
||||
min-height: 100vh;
|
||||
position: relative;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.skip-link { position: absolute; left: -999px; top: 0.5rem; padding: 0.5rem 0.9rem; background: #0f0a1c; border-radius: var(--radius-md); border: 1px solid var(--border); box-shadow: var(--shadow-soft); color: var(--text); text-decoration: none; z-index: 100; }
|
||||
.skip-link:focus, .skip-link:focus-visible { left: 1rem; outline: 2px solid var(--accent-2); outline-offset: 3px; }
|
||||
|
||||
body::before {
|
||||
content: "";
|
||||
pointer-events: none;
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
opacity: 0.11;
|
||||
background-image:
|
||||
linear-gradient(0deg, rgba(255,255,255,0.08) 1px, transparent 1px),
|
||||
radial-gradient(circle at 0 0, rgba(255,255,255,0.12) 0, transparent 50%);
|
||||
background-size: 100% 2px, 260px 260px;
|
||||
mix-blend-mode: soft-light;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
a { color: var(--accent-2); text-decoration: none; }
|
||||
a:hover { text-decoration: underline; }
|
||||
|
||||
.container { width: 100%; max-width: 1120px; margin: 0 auto; padding: 0 1.5rem; }
|
||||
.topbar { position: sticky; top: 0; z-index: 20; backdrop-filter: blur(18px); background: linear-gradient(to right, rgba(5,2,16,0.94), rgba(5,0,8,0.92)); border-bottom: 1px solid var(--border); }
|
||||
.topbar-inner { display: flex; align-items: center; justify-content: space-between; padding: 0.7rem 1.5rem; gap: 1rem; }
|
||||
.logo-mark { display: flex; align-items: center; gap: 0.7rem; }
|
||||
.logo-circle { width: 32px; height: 32px; border-radius: 999px; background: conic-gradient(from 210deg, #ff0033, #ff9100, #ff00aa, #00ffcc, #ff0033); display: flex; align-items: center; justify-content: center; box-shadow: var(--shadow-soft); position: relative; overflow: hidden; }
|
||||
.logo-circle::after { content: "D"; font-size: 18px; font-weight: 800; color: #05020a; text-shadow: 0 0 10px rgba(0,0,0,0.6); }
|
||||
.logo-text-main { font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; font-size: 0.85rem; }
|
||||
.logo-text-sub { font-size: 0.70rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.18em; }
|
||||
.nav-links { display: flex; gap: 1.1rem; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.16em; flex-wrap: wrap; justify-content: flex-end; }
|
||||
.nav-links a { color: var(--muted); text-decoration: none; position: relative; padding-bottom: 0.2rem; }
|
||||
.nav-links a::after { content: ""; position: absolute; left: 0; bottom: 0; width: 0; height: 2px; background: linear-gradient(90deg, var(--accent), var(--accent-2)); transition: width 0.2s ease-out; }
|
||||
.nav-links a:hover::after, .nav-links a[aria-current="page"]::after { width: 100%; }
|
||||
|
||||
.section { padding: 3.3rem 0; position: relative; }
|
||||
.section-header { display: grid; gap: 0.5rem; max-width: 760px; margin-bottom: 2rem; }
|
||||
.section-kicker { font-size: 0.85rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--accent-2); }
|
||||
.section-title { font-size: 2.15rem; margin: 0; letter-spacing: -0.02em; }
|
||||
.section-description { margin: 0; color: var(--muted); line-height: 1.6; }
|
||||
|
||||
.note-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; }
|
||||
.note-card { background: var(--card-bg); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 1.2rem; box-shadow: var(--shadow-soft); }
|
||||
.note-title { margin: 0 0 0.4rem 0; display: flex; align-items: center; gap: 0.4rem; letter-spacing: -0.01em; }
|
||||
.note-body { margin: 0 0 0.8rem 0; color: var(--muted); line-height: 1.5; }
|
||||
.checklist { padding-left: 1.2rem; margin: 0 0 0.9rem 0; color: var(--text); line-height: 1.5; }
|
||||
.checklist-item { position: relative; list-style: none; margin-bottom: 0.4rem; padding-left: 1.2rem; }
|
||||
.status-dot { position: absolute; left: 0; top: 0.35rem; width: 0.6rem; height: 0.6rem; border-radius: 999px; }
|
||||
.ready { background: #2add6d; } .info { background: #00b7ff; } .warn { background: #ffc107; }
|
||||
.tag { display: inline-flex; align-items: center; gap: 0.35rem; border-radius: 999px; background: var(--accent-soft); color: var(--text); padding: 0.35rem 0.85rem; font-size: 0.85rem; text-decoration: none; border: 1px solid var(--border); }
|
||||
.list { margin: 0; padding-left: 1.2rem; color: var(--muted); line-height: 1.6; }
|
||||
.list li + li { margin-top: 0.35rem; }
|
||||
|
||||
@media (max-width: 640px) { .topbar-inner { flex-direction: column; align-items: flex-start; } .nav-links { justify-content: flex-start; } }
|
||||
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<a class="skip-link" href="#main-content">Skip to main content</a>
|
||||
<header class="topbar">
|
||||
<div class="container topbar-inner">
|
||||
<div class="logo-mark">
|
||||
<div class="logo-circle"></div>
|
||||
<div>
|
||||
<div class="logo-text-main">DIABLO</div>
|
||||
<div class="logo-text-sub">PENTESTING · HACKING · REPORTING</div>
|
||||
</div>
|
||||
</div>
|
||||
<nav class="nav-links" aria-label="Primary">
|
||||
<a href="index.html#about">About</a>
|
||||
<a href="index.html#features">Features</a>
|
||||
<a href="index.html#install">Install</a>
|
||||
<a href="index.html#usage">Usage</a>
|
||||
<a href="index.html#readiness">Readiness</a>
|
||||
<a href="index.html#docs">Docs</a>
|
||||
<a href="index.html#pages">Pages</a>
|
||||
<a href="playbooks.html">Playbooks</a>
|
||||
<a href="lab-setup.html" aria-current="page">Lab Setup</a>
|
||||
<a href="reporting.html">Reporting</a>
|
||||
<a href="index.html#roadmap">Roadmap</a>
|
||||
<a href="index.html#security">Security</a>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main id="main-content">
|
||||
<section class="section">
|
||||
<div class="container section-header">
|
||||
<div class="section-kicker">🧪 Labs</div>
|
||||
<h1 class="section-title">Build Repeatable & Safe Diablo Labs</h1>
|
||||
<p class="section-description">
|
||||
Lightweight setups for demos, training, and client environments. Keep experiments contained,
|
||||
monitored, and easy to rebuild.
|
||||
</p>
|
||||
<a class="tag" href="index.html#readiness">Return to readiness checklist</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section" style="background: var(--bg-alt);">
|
||||
<div class="container">
|
||||
<div class="section-header">
|
||||
<div class="section-kicker">🏗️ Baselines</div>
|
||||
<h2 class="section-title">Reference Lab Shapes</h2>
|
||||
<p class="section-description">
|
||||
Pick a profile and clone it. Each baseline keeps isolation and observability front-and-center.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="note-grid">
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Solo Research</h3>
|
||||
<p class="note-body">Single host, fast rebuilds.</p>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>1 VM or container snapshot per technique.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Local logging to file + periodic export.</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Reset to golden image weekly.</li>
|
||||
</ul>
|
||||
</article>
|
||||
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Client Simulation</h3>
|
||||
<p class="note-body">Mini environment for scoped tests.</p>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>AD/DC + app server + defender box.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Segmented networks with clear firewall rules.</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Ops runbook for snapshots and restores.</li>
|
||||
</ul>
|
||||
</article>
|
||||
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Collab Training</h3>
|
||||
<p class="note-body">Shared practice with rollback.</p>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>Per-user namespaces or VMs.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Centralized logging and SIEM alerts.</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Daily cleanup job to revert state.</li>
|
||||
</ul>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section">
|
||||
<div class="container">
|
||||
<div class="section-header">
|
||||
<div class="section-kicker">🔒 Hardening</div>
|
||||
<h2 class="section-title">Safety & OpSec Defaults</h2>
|
||||
<p class="section-description">Keep the lab useful without leaking secrets or leaving debris.</p>
|
||||
</div>
|
||||
|
||||
<div class="note-grid">
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Access Control</h3>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>Unique credentials per operator.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Vault secrets outside of VM snapshots.</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>MFA for gateways and dashboards.</li>
|
||||
</ul>
|
||||
</article>
|
||||
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Observability</h3>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>Sysmon/Osquery where possible.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Packet capture ring buffer with retention policy.</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Alert on beacon-like traffic leaving the lab.</li>
|
||||
</ul>
|
||||
</article>
|
||||
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Recovery</h3>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>Documented rollback steps per host.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Immutable backups for clean baselines.</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Post-engagement cleanup sign-off.</li>
|
||||
</ul>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section" style="background: var(--bg-alt);">
|
||||
<div class="container">
|
||||
<div class="section-header">
|
||||
<div class="section-kicker">⚙️ Tooling</div>
|
||||
<h2 class="section-title">Starter Stack</h2>
|
||||
<p class="section-description">Suggested tools for quick bring-up; swap as needed.</p>
|
||||
</div>
|
||||
<div class="note-grid">
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Networking</h3>
|
||||
<ul class="list">
|
||||
<li>dnsmasq / bind for controlled DNS.</li>
|
||||
<li>HAProxy / Traefik for routing experiments.</li>
|
||||
<li>WireGuard for remote teammate access.</li>
|
||||
</ul>
|
||||
</article>
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Instrument</h3>
|
||||
<ul class="list">
|
||||
<li>Elastic or Loki stack for logs.</li>
|
||||
<li>Grafana dashboards for quick trends.</li>
|
||||
<li>Filebeat/Winlogbeat agents on all hosts.</li>
|
||||
</ul>
|
||||
</article>
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Reset</h3>
|
||||
<ul class="list">
|
||||
<li>VM snapshots per scenario.</li>
|
||||
<li>Container compose files in git with tags.</li>
|
||||
<li>Nightly cleanup scripts validated weekly.</li>
|
||||
</ul>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
486
playbooks.html
Normal file
486
playbooks.html
Normal file
@@ -0,0 +1,486 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Diablo · Playbooks</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta name="description" content="Operational playbooks for Diablo pentesting flows." />
|
||||
<style>
|
||||
:root {
|
||||
--bg: #05020a;
|
||||
--bg-alt: #0a0714;
|
||||
--card-bg: #0f0a1c;
|
||||
--accent: #ff0033;
|
||||
--accent-soft: rgba(255, 0, 80, 0.22);
|
||||
--accent-2: #00ffcc;
|
||||
--text: #f5f5f5;
|
||||
--muted: #a0a0c0;
|
||||
--border: rgba(255, 255, 255, 0.06);
|
||||
--radius-lg: 18px;
|
||||
--radius-md: 12px;
|
||||
--shadow-strong: 0 0 60px rgba(255, 0, 60, 0.35);
|
||||
--shadow-soft: 0 0 35px rgba(0, 255, 204, 0.18);
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html, body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
|
||||
background:
|
||||
radial-gradient(circle at top, #250016 0, transparent 55%),
|
||||
radial-gradient(circle at bottom, #00131a 0, transparent 60%),
|
||||
linear-gradient(135deg, #010007 0, #060313 40%, #050008 100%);
|
||||
color: var(--text);
|
||||
min-height: 100vh;
|
||||
position: relative;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.skip-link {
|
||||
position: absolute;
|
||||
left: -999px;
|
||||
top: 0.5rem;
|
||||
padding: 0.5rem 0.9rem;
|
||||
background: #0f0a1c;
|
||||
border-radius: var(--radius-md);
|
||||
border: 1px solid var(--border);
|
||||
box-shadow: var(--shadow-soft);
|
||||
color: var(--text);
|
||||
text-decoration: none;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.skip-link:focus,
|
||||
.skip-link:focus-visible {
|
||||
left: 1rem;
|
||||
outline: 2px solid var(--accent-2);
|
||||
outline-offset: 3px;
|
||||
}
|
||||
|
||||
body::before {
|
||||
content: "";
|
||||
pointer-events: none;
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
opacity: 0.11;
|
||||
background-image:
|
||||
linear-gradient(0deg, rgba(255,255,255,0.08) 1px, transparent 1px),
|
||||
radial-gradient(circle at 0 0, rgba(255,255,255,0.12) 0, transparent 50%);
|
||||
background-size: 100% 2px, 260px 260px;
|
||||
mix-blend-mode: soft-light;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--accent-2);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.container {
|
||||
width: 100%;
|
||||
max-width: 1120px;
|
||||
margin: 0 auto;
|
||||
padding: 0 1.5rem;
|
||||
}
|
||||
|
||||
.topbar {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 20;
|
||||
backdrop-filter: blur(18px);
|
||||
background: linear-gradient(to right, rgba(5,2,16,0.94), rgba(5,0,8,0.92));
|
||||
border-bottom: 1px solid var(--border);
|
||||
}
|
||||
|
||||
.topbar-inner {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0.7rem 1.5rem;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.logo-mark {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.7rem;
|
||||
}
|
||||
|
||||
.logo-circle {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border-radius: 999px;
|
||||
background:
|
||||
conic-gradient(from 210deg, #ff0033, #ff9100, #ff00aa, #00ffcc, #ff0033);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-shadow: var(--shadow-soft);
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.logo-circle::after {
|
||||
content: "D";
|
||||
font-size: 18px;
|
||||
font-weight: 800;
|
||||
color: #05020a;
|
||||
text-shadow: 0 0 10px rgba(0,0,0,0.6);
|
||||
}
|
||||
|
||||
.logo-text-main {
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.12em;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.logo-text-sub {
|
||||
font-size: 0.70rem;
|
||||
color: var(--muted);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.18em;
|
||||
}
|
||||
|
||||
.nav-links {
|
||||
display: flex;
|
||||
gap: 1.1rem;
|
||||
font-size: 0.85rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.16em;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.nav-links a {
|
||||
color: var(--muted);
|
||||
text-decoration: none;
|
||||
position: relative;
|
||||
padding-bottom: 0.2rem;
|
||||
}
|
||||
|
||||
.nav-links a::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 0;
|
||||
height: 2px;
|
||||
background: linear-gradient(90deg, var(--accent), var(--accent-2));
|
||||
transition: width 0.2s ease-out;
|
||||
}
|
||||
|
||||
.nav-links a:hover::after,
|
||||
.nav-links a[aria-current="page"]::after {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.section {
|
||||
padding: 3.3rem 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.hero {
|
||||
padding-top: 3rem;
|
||||
}
|
||||
|
||||
.section-header {
|
||||
display: grid;
|
||||
gap: 0.5rem;
|
||||
max-width: 760px;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.section-kicker {
|
||||
font-size: 0.85rem;
|
||||
letter-spacing: 0.18em;
|
||||
text-transform: uppercase;
|
||||
color: var(--accent-2);
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 2.15rem;
|
||||
margin: 0;
|
||||
letter-spacing: -0.02em;
|
||||
}
|
||||
|
||||
.section-description {
|
||||
margin: 0;
|
||||
color: var(--muted);
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.note-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.note-card {
|
||||
background: var(--card-bg);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: var(--radius-lg);
|
||||
padding: 1.2rem;
|
||||
box-shadow: var(--shadow-soft);
|
||||
}
|
||||
|
||||
.note-title {
|
||||
margin: 0 0 0.4rem 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.4rem;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
|
||||
.note-body {
|
||||
margin: 0 0 0.8rem 0;
|
||||
color: var(--muted);
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.checklist {
|
||||
padding-left: 1.2rem;
|
||||
margin: 0 0 0.9rem 0;
|
||||
color: var(--text);
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.checklist-item {
|
||||
position: relative;
|
||||
list-style: none;
|
||||
margin-bottom: 0.4rem;
|
||||
padding-left: 1.2rem;
|
||||
}
|
||||
|
||||
.status-dot {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0.35rem;
|
||||
width: 0.6rem;
|
||||
height: 0.6rem;
|
||||
border-radius: 999px;
|
||||
}
|
||||
|
||||
.ready { background: #2add6d; }
|
||||
.info { background: #00b7ff; }
|
||||
.warn { background: #ffc107; }
|
||||
|
||||
.tag {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.35rem;
|
||||
border-radius: 999px;
|
||||
background: var(--accent-soft);
|
||||
color: var(--text);
|
||||
padding: 0.35rem 0.85rem;
|
||||
font-size: 0.85rem;
|
||||
text-decoration: none;
|
||||
border: 1px solid var(--border);
|
||||
}
|
||||
|
||||
.split {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
|
||||
gap: 1.2rem;
|
||||
align-items: start;
|
||||
}
|
||||
|
||||
.list {
|
||||
margin: 0;
|
||||
padding-left: 1.2rem;
|
||||
color: var(--muted);
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.list li + li {
|
||||
margin-top: 0.35rem;
|
||||
}
|
||||
|
||||
.section-cta {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.4rem;
|
||||
padding: 0.6rem 1rem;
|
||||
background: linear-gradient(90deg, var(--accent), var(--accent-2));
|
||||
color: #05020a;
|
||||
border-radius: var(--radius-md);
|
||||
border: none;
|
||||
text-decoration: none;
|
||||
font-weight: 700;
|
||||
box-shadow: var(--shadow-strong);
|
||||
}
|
||||
|
||||
.section-cta:hover { opacity: 0.92; }
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.topbar-inner { flex-direction: column; align-items: flex-start; }
|
||||
.nav-links { justify-content: flex-start; }
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
*, *::before, *::after {
|
||||
animation-duration: 0.01ms !important;
|
||||
animation-iteration-count: 1 !important;
|
||||
transition-duration: 0.01ms !important;
|
||||
scroll-behavior: auto !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<a class="skip-link" href="#main-content">Skip to main content</a>
|
||||
<header class="topbar">
|
||||
<div class="container topbar-inner">
|
||||
<div class="logo-mark">
|
||||
<div class="logo-circle"></div>
|
||||
<div>
|
||||
<div class="logo-text-main">DIABLO</div>
|
||||
<div class="logo-text-sub">PENTESTING · HACKING · REPORTING</div>
|
||||
</div>
|
||||
</div>
|
||||
<nav class="nav-links" aria-label="Primary">
|
||||
<a href="index.html#about">About</a>
|
||||
<a href="index.html#features">Features</a>
|
||||
<a href="index.html#install">Install</a>
|
||||
<a href="index.html#usage">Usage</a>
|
||||
<a href="index.html#readiness">Readiness</a>
|
||||
<a href="index.html#docs">Docs</a>
|
||||
<a href="index.html#pages">Pages</a>
|
||||
<a href="playbooks.html" aria-current="page">Playbooks</a>
|
||||
<a href="lab-setup.html">Lab Setup</a>
|
||||
<a href="reporting.html">Reporting</a>
|
||||
<a href="index.html#roadmap">Roadmap</a>
|
||||
<a href="index.html#security">Security</a>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main id="main-content">
|
||||
<section class="section hero">
|
||||
<div class="container section-header">
|
||||
<div class="section-kicker">📓 Playbooks</div>
|
||||
<h1 class="section-title">Operational Playbooks for Diablo Runs</h1>
|
||||
<p class="section-description">
|
||||
Ready-made flows you can adapt on the fly. Each phase highlights quick wins, safety checks,
|
||||
and reporting hooks so your runs stay auditable.
|
||||
</p>
|
||||
<a class="section-cta" href="index.html#usage">Return to main usage guide</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section">
|
||||
<div class="container">
|
||||
<div class="section-header">
|
||||
<div class="section-kicker">🔍 Recon</div>
|
||||
<h2 class="section-title">Discovery & Scoping</h2>
|
||||
<p class="section-description">
|
||||
Start lean. Prioritize targets, document approvals, and keep traffic low-noise before
|
||||
deep enumeration.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="note-grid">
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Network Sweep</h3>
|
||||
<p class="note-body">Map what answers, then decide whether to pivot deeper.</p>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>Define in-scope subnets and assets.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Low-and-slow ping/ARP discovery first.</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Pause if rate limits or SOC alerts fire.</li>
|
||||
</ul>
|
||||
</article>
|
||||
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Service Fingerprinting</h3>
|
||||
<p class="note-body">Capture banners and TLS quickly so you can sort findings.</p>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>Enumerate open ports and versions.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Tag crown-jewel services (auth, data, control).</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Record timing so retries are consistent.</li>
|
||||
</ul>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section" style="background: var(--bg-alt);">
|
||||
<div class="container">
|
||||
<div class="section-header">
|
||||
<div class="section-kicker">🛠️ Access & Escalation</div>
|
||||
<h2 class="section-title">Exploit with Guardrails</h2>
|
||||
<p class="section-description">
|
||||
Move with intent: validate every exploit, snapshot state, and prep your rollback path
|
||||
before escalating.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="split">
|
||||
<div class="note-card">
|
||||
<h3 class="note-title">Initial Access</h3>
|
||||
<p class="note-body">Keep first touch reversible and logged.</p>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>Exploit selection mapped to CVEs and scope.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Artifacts and payloads stored per-target.</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Immediate rollback (service restart or restore point).</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="note-card">
|
||||
<h3 class="note-title">Privilege Escalation</h3>
|
||||
<p class="note-body">Escalate safely with minimal persistence.</p>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>Log commands and hash artifacts.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Check defenders' telemetry before loud actions.</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Restore configs after testing persistence.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section">
|
||||
<div class="container">
|
||||
<div class="section-header">
|
||||
<div class="section-kicker">📤 Reporting Hooks</div>
|
||||
<h2 class="section-title">Close the Loop</h2>
|
||||
<p class="section-description">
|
||||
Tie every action back to evidence so the final Markdown report is repeatable and concise.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="note-grid">
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Evidence Pack</h3>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>Screenshots, command logs, and hashes per finding.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Environment notes (time, host, IP, creds).</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Countermeasure ideas listed next to impact.</li>
|
||||
</ul>
|
||||
</article>
|
||||
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Cleanup & Handoff</h3>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>Stopped shells, removed test users, restored configs.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Documented what was left intentionally (e.g., test accounts).</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Shared remediation sequence with owners.</li>
|
||||
</ul>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
254
reporting.html
Normal file
254
reporting.html
Normal file
@@ -0,0 +1,254 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Diablo · Reporting</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta name="description" content="Reporting guidance and templates for Diablo findings." />
|
||||
<style>
|
||||
:root {
|
||||
--bg: #05020a;
|
||||
--bg-alt: #0a0714;
|
||||
--card-bg: #0f0a1c;
|
||||
--accent: #ff0033;
|
||||
--accent-soft: rgba(255, 0, 80, 0.22);
|
||||
--accent-2: #00ffcc;
|
||||
--text: #f5f5f5;
|
||||
--muted: #a0a0c0;
|
||||
--border: rgba(255, 255, 255, 0.06);
|
||||
--radius-lg: 18px;
|
||||
--radius-md: 12px;
|
||||
--shadow-strong: 0 0 60px rgba(255, 0, 60, 0.35);
|
||||
--shadow-soft: 0 0 35px rgba(0, 255, 204, 0.18);
|
||||
}
|
||||
|
||||
* { box-sizing: border-box; }
|
||||
html, body { margin: 0; padding: 0; scroll-behavior: smooth; }
|
||||
body {
|
||||
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
|
||||
background:
|
||||
radial-gradient(circle at top, #250016 0, transparent 55%),
|
||||
radial-gradient(circle at bottom, #00131a 0, transparent 60%),
|
||||
linear-gradient(135deg, #010007 0, #060313 40%, #050008 100%);
|
||||
color: var(--text);
|
||||
min-height: 100vh;
|
||||
position: relative;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.skip-link { position: absolute; left: -999px; top: 0.5rem; padding: 0.5rem 0.9rem; background: #0f0a1c; border-radius: var(--radius-md); border: 1px solid var(--border); box-shadow: var(--shadow-soft); color: var(--text); text-decoration: none; z-index: 100; }
|
||||
.skip-link:focus, .skip-link:focus-visible { left: 1rem; outline: 2px solid var(--accent-2); outline-offset: 3px; }
|
||||
|
||||
body::before {
|
||||
content: "";
|
||||
pointer-events: none;
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
opacity: 0.11;
|
||||
background-image:
|
||||
linear-gradient(0deg, rgba(255,255,255,0.08) 1px, transparent 1px),
|
||||
radial-gradient(circle at 0 0, rgba(255,255,255,0.12) 0, transparent 50%);
|
||||
background-size: 100% 2px, 260px 260px;
|
||||
mix-blend-mode: soft-light;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
a { color: var(--accent-2); text-decoration: none; }
|
||||
a:hover { text-decoration: underline; }
|
||||
|
||||
.container { width: 100%; max-width: 1120px; margin: 0 auto; padding: 0 1.5rem; }
|
||||
.topbar { position: sticky; top: 0; z-index: 20; backdrop-filter: blur(18px); background: linear-gradient(to right, rgba(5,2,16,0.94), rgba(5,0,8,0.92)); border-bottom: 1px solid var(--border); }
|
||||
.topbar-inner { display: flex; align-items: center; justify-content: space-between; padding: 0.7rem 1.5rem; gap: 1rem; }
|
||||
.logo-mark { display: flex; align-items: center; gap: 0.7rem; }
|
||||
.logo-circle { width: 32px; height: 32px; border-radius: 999px; background: conic-gradient(from 210deg, #ff0033, #ff9100, #ff00aa, #00ffcc, #ff0033); display: flex; align-items: center; justify-content: center; box-shadow: var(--shadow-soft); position: relative; overflow: hidden; }
|
||||
.logo-circle::after { content: "D"; font-size: 18px; font-weight: 800; color: #05020a; text-shadow: 0 0 10px rgba(0,0,0,0.6); }
|
||||
.logo-text-main { font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; font-size: 0.85rem; }
|
||||
.logo-text-sub { font-size: 0.70rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.18em; }
|
||||
.nav-links { display: flex; gap: 1.1rem; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.16em; flex-wrap: wrap; justify-content: flex-end; }
|
||||
.nav-links a { color: var(--muted); text-decoration: none; position: relative; padding-bottom: 0.2rem; }
|
||||
.nav-links a::after { content: ""; position: absolute; left: 0; bottom: 0; width: 0; height: 2px; background: linear-gradient(90deg, var(--accent), var(--accent-2)); transition: width 0.2s ease-out; }
|
||||
.nav-links a:hover::after, .nav-links a[aria-current="page"]::after { width: 100%; }
|
||||
|
||||
.section { padding: 3.3rem 0; position: relative; }
|
||||
.section-header { display: grid; gap: 0.5rem; max-width: 760px; margin-bottom: 2rem; }
|
||||
.section-kicker { font-size: 0.85rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--accent-2); }
|
||||
.section-title { font-size: 2.15rem; margin: 0; letter-spacing: -0.02em; }
|
||||
.section-description { margin: 0; color: var(--muted); line-height: 1.6; }
|
||||
|
||||
.note-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; }
|
||||
.note-card { background: var(--card-bg); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 1.2rem; box-shadow: var(--shadow-soft); }
|
||||
.note-title { margin: 0 0 0.4rem 0; display: flex; align-items: center; gap: 0.4rem; letter-spacing: -0.01em; }
|
||||
.note-body { margin: 0 0 0.8rem 0; color: var(--muted); line-height: 1.5; }
|
||||
.checklist { padding-left: 1.2rem; margin: 0 0 0.9rem 0; color: var(--text); line-height: 1.5; }
|
||||
.checklist-item { position: relative; list-style: none; margin-bottom: 0.4rem; padding-left: 1.2rem; }
|
||||
.status-dot { position: absolute; left: 0; top: 0.35rem; width: 0.6rem; height: 0.6rem; border-radius: 999px; }
|
||||
.ready { background: #2add6d; } .info { background: #00b7ff; } .warn { background: #ffc107; }
|
||||
.tag { display: inline-flex; align-items: center; gap: 0.35rem; border-radius: 999px; background: var(--accent-soft); color: var(--text); padding: 0.35rem 0.85rem; font-size: 0.85rem; text-decoration: none; border: 1px solid var(--border); }
|
||||
.list { margin: 0; padding-left: 1.2rem; color: var(--muted); line-height: 1.6; }
|
||||
.list li + li { margin-top: 0.35rem; }
|
||||
|
||||
@media (max-width: 640px) { .topbar-inner { flex-direction: column; align-items: flex-start; } .nav-links { justify-content: flex-start; } }
|
||||
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<a class="skip-link" href="#main-content">Skip to main content</a>
|
||||
<header class="topbar">
|
||||
<div class="container topbar-inner">
|
||||
<div class="logo-mark">
|
||||
<div class="logo-circle"></div>
|
||||
<div>
|
||||
<div class="logo-text-main">DIABLO</div>
|
||||
<div class="logo-text-sub">PENTESTING · HACKING · REPORTING</div>
|
||||
</div>
|
||||
</div>
|
||||
<nav class="nav-links" aria-label="Primary">
|
||||
<a href="index.html#about">About</a>
|
||||
<a href="index.html#features">Features</a>
|
||||
<a href="index.html#install">Install</a>
|
||||
<a href="index.html#usage">Usage</a>
|
||||
<a href="index.html#readiness">Readiness</a>
|
||||
<a href="index.html#docs">Docs</a>
|
||||
<a href="index.html#pages">Pages</a>
|
||||
<a href="playbooks.html">Playbooks</a>
|
||||
<a href="lab-setup.html">Lab Setup</a>
|
||||
<a href="reporting.html" aria-current="page">Reporting</a>
|
||||
<a href="index.html#roadmap">Roadmap</a>
|
||||
<a href="index.html#security">Security</a>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main id="main-content">
|
||||
<section class="section">
|
||||
<div class="container section-header">
|
||||
<div class="section-kicker">📝 Reporting</div>
|
||||
<h1 class="section-title">Ship Clear, Actionable Findings</h1>
|
||||
<p class="section-description">
|
||||
Use these outlines to keep Diablo reports concise, reproducible, and tailored to your audience.
|
||||
Pair them with evidence packs so remediation is fast.
|
||||
</p>
|
||||
<a class="tag" href="index.html#readiness">Check readiness before delivery</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section" style="background: var(--bg-alt);">
|
||||
<div class="container">
|
||||
<div class="section-header">
|
||||
<div class="section-kicker">📄 Templates</div>
|
||||
<h2 class="section-title">Markdown Skeletons</h2>
|
||||
<p class="section-description">Copy, adjust, and keep consistent across engagements.</p>
|
||||
</div>
|
||||
<div class="note-grid">
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Executive Snapshot</h3>
|
||||
<ul class="list">
|
||||
<li>Context (scope, timeline, owners).</li>
|
||||
<li>Top 3 risks with business impact.</li>
|
||||
<li>Remediation ETA and dependencies.</li>
|
||||
</ul>
|
||||
</article>
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Technical Finding</h3>
|
||||
<ul class="list">
|
||||
<li>Title + severity + asset identifier.</li>
|
||||
<li>Repro steps with commands and responses.</li>
|
||||
<li>Evidence links (hashes, screenshots, pcaps).</li>
|
||||
<li>Fix guidance + validation steps.</li>
|
||||
</ul>
|
||||
</article>
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Changelog</h3>
|
||||
<ul class="list">
|
||||
<li>Runs executed (date/time/host).</li>
|
||||
<li>Tools and versions used.</li>
|
||||
<li>Cleanup and rollback actions taken.</li>
|
||||
</ul>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section">
|
||||
<div class="container">
|
||||
<div class="section-header">
|
||||
<div class="section-kicker">🎯 Delivery</div>
|
||||
<h2 class="section-title">Tailor for the Audience</h2>
|
||||
<p class="section-description">Pick a delivery path that meets stakeholders where they are.</p>
|
||||
</div>
|
||||
|
||||
<div class="note-grid">
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Stakeholder Brief</h3>
|
||||
<p class="note-body">Slides or PDF with visuals.</p>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>One slide per critical issue.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Impact framed in business terms.</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Clear next steps and owners.</li>
|
||||
</ul>
|
||||
</article>
|
||||
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Engineer Hand-off</h3>
|
||||
<p class="note-body">Repo or wiki entry with diffs.</p>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>Commands, configs, and sample payloads.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Tests to verify the fix (unit/integration).</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Rollback steps documented.</li>
|
||||
</ul>
|
||||
</article>
|
||||
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Leadership Summary</h3>
|
||||
<p class="note-body">Concise email or memo.</p>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>One paragraph of highlights.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Risk trend (improving/regressing).</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Asks: budget, tooling, or policy changes.</li>
|
||||
</ul>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section" style="background: var(--bg-alt);">
|
||||
<div class="container">
|
||||
<div class="section-header">
|
||||
<div class="section-kicker">✅ QA</div>
|
||||
<h2 class="section-title">Pre-Delivery Checklist</h2>
|
||||
<p class="section-description">Last pass before you send anything out.</p>
|
||||
</div>
|
||||
|
||||
<div class="note-grid">
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Content</h3>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>Redacted secrets and client-identifying data.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>CVSS/impact ratings match evidence.</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Findings mapped to scope and ticket IDs.</li>
|
||||
</ul>
|
||||
</article>
|
||||
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Format</h3>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>Headings and numbering consistent.</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Images compressed; hashes recorded.</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Accessibility tags on diagrams/charts.</li>
|
||||
</ul>
|
||||
</article>
|
||||
|
||||
<article class="note-card">
|
||||
<h3 class="note-title">Handoff</h3>
|
||||
<ul class="checklist">
|
||||
<li class="checklist-item"><span class="status-dot ready" aria-hidden="true"></span>Delivery channel agreed (email, portal, live readout).</li>
|
||||
<li class="checklist-item"><span class="status-dot info" aria-hidden="true"></span>Links to evidence packs and lab notes.</li>
|
||||
<li class="checklist-item"><span class="status-dot warn" aria-hidden="true"></span>Plan for follow-up validation scheduled.</li>
|
||||
</ul>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user