-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
152 lines (142 loc) · 17.6 KB
/
index.html
File metadata and controls
152 lines (142 loc) · 17.6 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
<!DOCTYPE html>
<html lang="en" class="scroll-smooth">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>The Evidence Room | Investigate the Web. Legally.</title>
<script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
<link rel="stylesheet" href="styles/index.css">
<script src="scripts/index.js" defer></script>
</head>
<body class="antialiased selection:bg-[#7fff00] selection:text-black">
<div class="site-shell min-h-screen bg-grid">
<div class="particles-bg"></div>
<header class="glass sticky top-0 z-50">
<div class="container mx-auto px-6 py-4 flex items-center justify-between gap-4">
<a href="#hero" class="flex items-center gap-2 text-[#7fff00] font-bold text-lg md:text-xl tracking-wider">
<i class="bi bi-terminal"></i>
<span class="text-white">THE EVIDENCE ROOM</span>
</a>
<nav class="hidden lg:flex gap-6 text-sm font-medium text-[#94a3b8]">
<a href="#how-it-works" class="hover:text-white transition">How It Works</a>
<a href="#demo" class="hover:text-white transition">Demo</a>
<a href="#features" class="hover:text-white transition">Arsenal</a>
<a href="#use-cases" class="hover:text-white transition">Use Cases</a>
<a href="#philosophy" class="hover:text-white transition">Philosophy</a>
<a href="#mission" class="hover:text-white transition">Mission</a>
</nav>
<div class="flex items-center gap-3">
<a href="#demo" class="hidden sm:inline-flex items-center px-4 py-2 text-sm font-medium text-[#94a3b8] hover:text-white transition">View Demo</a>
<a href="dashboard.html" class="bg-[#7fff00] text-black px-5 py-2 rounded font-semibold text-sm hover:bg-green-400 transition shadow-[0_0_15px_rgba(127,255,0,0.3)]">Launch Terminal</a>
</div>
</div>
</header>
<main id="hero" class="min-h-[calc(100vh-72px)] flex items-center justify-center py-20">
<div class="container mx-auto px-6 text-center">
<div class="inline-block mb-4 px-3 py-1 rounded-full border border-[#7fff00]/30 bg-[#7fff00]/10 text-[#7fff00] text-xs font-mono tracking-widest uppercase fade-in">
System Online // Access Granted
</div>
<h1 class="text-4xl md:text-6xl lg:text-7xl font-extrabold mb-4 tracking-tight fade-in">
<span class="text-white">The Evidence Room</span>
</h1>
<div class="text-3xl md:text-5xl font-bold mb-6 fade-in delay-1">
<span class="text-[#94a3b8]">Investigate the Web.</span>
<span class="text-[#7fff00] glow-text font-mono typing-cursor" id="typing-text"></span>
</div>
<p class="text-lg md:text-xl text-[#94a3b8] max-w-2xl mx-auto mb-10 fade-in delay-2">
Advanced Open Source Intelligence dashboard for gathering, analyzing, and correlating public data with a professional cyber-grade toolkit.
</p>
<div class="flex flex-col sm:flex-row gap-4 justify-center fade-in delay-3">
<a href="dashboard.html" class="group px-8 py-4 bg-[#7fff00] text-black font-bold text-lg rounded shadow-[0_0_20px_rgba(127,255,0,0.4)] hover:shadow-[0_0_30px_rgba(127,255,0,0.6)] transition-all inline-flex items-center justify-center gap-2">
<i class="bi bi-play-fill"></i> Start Investigation
</a>
<a href="#demo" class="px-8 py-4 bg-[#1f2937]/50 text-white font-semibold text-lg rounded border border-white/10 hover:bg-[#1f2937] hover:border-[#7fff00]/50 transition inline-flex items-center justify-center gap-2">
<i class="bi bi-eye"></i> View Demo
</a>
</div>
</div>
</main>
<section id="how-it-works" class="py-24 bg-[#0a0a0f] border-t border-white/5">
<div class="container mx-auto px-6">
<div class="text-center mb-20">
<h2 class="text-4xl font-bold mb-4">How It Works</h2>
<p class="text-[#94a3b8] text-lg">A streamlined intelligence gathering pipeline.</p>
</div>
<div class="flex flex-col md:flex-row items-center justify-center gap-8 md:gap-0">
<div class="flex-1 text-center px-4">
<div class="workflow-icon"><i class="bi bi-input-cursor-text"></i></div>
<h3 class="text-xl font-bold text-white mb-3">1. Enter Target</h3>
<p class="text-[#94a3b8] text-sm leading-relaxed max-w-[250px] mx-auto">Input a username, email, IP address, or domain into the terminal.</p>
</div>
<div class="hidden md:block text-[#7fff00]/40 text-3xl"><i class="bi bi-arrow-right"></i></div>
<div class="flex-1 text-center px-4">
<div class="workflow-icon"><i class="bi bi-search"></i></div>
<h3 class="text-xl font-bold text-white mb-3">2. Scan Sources</h3>
<p class="text-[#94a3b8] text-sm leading-relaxed max-w-[250px] mx-auto">Our engine queries 50+ public data sources and correlated APIs.</p>
</div>
<div class="hidden md:block text-[#7fff00]/40 text-3xl"><i class="bi bi-arrow-right"></i></div>
<div class="flex-1 text-center px-4">
<div class="workflow-icon"><i class="bi bi-clipboard-data"></i></div>
<h3 class="text-xl font-bold text-white mb-3">3. Get Results</h3>
<p class="text-[#94a3b8] text-sm leading-relaxed max-w-[250px] mx-auto">Receive a structured, interactive report of all discovered intelligence.</p>
</div>
</div>
</div>
</section>
<section id="demo" class="py-20 border-t border-white/5">
<div class="container mx-auto px-6">
<div class="text-center mb-16">
<h2 class="text-3xl font-bold mb-4">Live Demo Preview</h2>
<p class="text-[#94a3b8]">Sample result cards make the terminal feel real before you launch it.</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
<article class="glass-panel p-6 relative glow-box demo-blur">
<span class="demo-badge">DEMO</span>
<div class="flex items-center gap-3 mb-4"><div class="mini-icon"><i class="bi bi-person-badge"></i></div><div><div class="text-sm text-[#94a3b8]">Username Search</div><div class="font-mono text-white">@johndoe</div></div></div>
<div class="space-y-2 text-sm">
<div class="result-row"><span><i class="bi bi-instagram mr-2"></i>Instagram</span><strong class="text-green-400">FOUND</strong></div>
<div class="result-row"><span><i class="bi bi-twitter-x mr-2"></i>Twitter</span><strong class="text-green-400">FOUND</strong></div>
<div class="result-row"><span><i class="bi bi-github mr-2"></i>GitHub</span><strong class="text-green-400">FOUND</strong></div>
<div class="result-row"><span><i class="bi bi-linkedin mr-2"></i>LinkedIn</span><strong>NOT FOUND</strong></div>
</div>
</article>
<article class="glass-panel p-6 relative glow-box demo-blur">
<span class="demo-badge">DEMO</span>
<div class="flex items-center gap-3 mb-4"><div class="mini-icon"><i class="bi bi-geo-alt"></i></div><div><div class="text-sm text-[#94a3b8]">IP Intelligence</div><div class="font-mono text-white">8.8.8.8</div></div></div>
<div class="space-y-2 text-sm"><div class="result-row"><span>Country</span><strong class="text-white">United States</strong></div><div class="result-row"><span>City</span><strong class="text-white">Mountain View</strong></div><div class="result-row"><span>ISP</span><strong class="text-white">Google LLC</strong></div><div class="result-row"><span>ASN</span><strong class="text-white">AS15169</strong></div></div>
</article>
<article class="glass-panel p-6 relative glow-box demo-blur">
<span class="demo-badge">DEMO</span>
<div class="flex items-center gap-3 mb-4"><div class="mini-icon"><i class="bi bi-globe2"></i></div><div><div class="text-sm text-[#94a3b8]">Domain Scanner</div><div class="font-mono text-white">example.com</div></div></div>
<div class="space-y-2 text-sm"><div class="result-row"><span>Status</span><strong class="text-green-400">Active</strong></div><div class="result-row"><span>SSL</span><strong class="text-green-400">Valid</strong></div><div class="result-row"><span>Registrar</span><strong class="text-white">ICANN</strong></div><div class="result-row"><span>Created</span><strong class="text-white">1995-08-14</strong></div></div>
</article>
</div>
</div>
</section>
<section id="features" class="py-24 bg-[#0a0a0f]/80 border-t border-white/5">
<div class="container mx-auto px-6">
<div class="text-center mb-16"><h2 class="text-4xl font-bold mb-4">The OSINT Arsenal</h2><p class="text-[#94a3b8] max-w-2xl mx-auto">A comprehensive suite of intelligence gathering modules designed for professional researchers and investigators.</p></div>
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5 gap-6">
<div class="arsenal-card"><i class="bi bi-person-badge"></i><h4>Username</h4><p>Profile Discovery</p></div>
<div class="arsenal-card"><i class="bi bi-envelope-at"></i><h4>Email</h4><p>Origin Analysis</p></div>
<div class="arsenal-card"><i class="bi bi-geo-alt"></i><h4>IP Intel</h4><p>Geolocation</p></div>
<div class="arsenal-card"><i class="bi bi-globe2"></i><h4>Domain</h4><p>DNS & WHOIS</p></div>
<div class="arsenal-card"><i class="bi bi-shield-exclamation"></i><h4>Breach</h4><p>Exposure Check</p></div>
<div class="arsenal-card"><i class="bi bi-phone"></i><h4>Phone</h4><p>Carrier Lookup</p></div>
<div class="arsenal-card"><i class="bi bi-diagram-3"></i><h4>Subdomain</h4><p>Enum Discovery</p></div>
<div class="arsenal-card"><i class="bi bi-lock"></i><h4>SSL Cert</h4><p>Cipher Analysis</p></div>
<div class="arsenal-card"><i class="bi bi-upc-scan"></i><h4>MAC</h4><p>Vendor Lookup</p></div>
<div class="arsenal-card"><i class="bi bi-link-45deg"></i><h4>URL</h4><p>Link Expander</p></div>
</div>
</div>
</section>
<section id="use-cases" class="py-20 border-t border-white/5"><div class="container mx-auto px-6"><div class="text-center mb-16"><h2 class="text-3xl font-bold mb-4">Who Uses This</h2><p class="text-[#94a3b8]">Built for professionals and learners alike.</p></div><div class="grid grid-cols-2 md:grid-cols-4 gap-6"><div class="use-card"><i class="bi bi-mortarboard"></i><h3>Students</h3><p>Learning OSINT and cybersecurity</p></div><div class="use-card"><i class="bi bi-newspaper"></i><h3>Journalists</h3><p>Researching sources and data</p></div><div class="use-card"><i class="bi bi-shield-lock"></i><h3>Security Pros</h3><p>Threat intelligence and recon</p></div><div class="use-card"><i class="bi bi-person-workspace"></i><h3>Investigators</h3><p>Digital forensics and cases</p></div></div></div></section>
<section id="philosophy" class="py-20 bg-[#0a0a0f]/80 border-t border-white/5"><div class="container mx-auto px-6 max-w-4xl"><div class="text-center mb-12"><h2 class="text-3xl font-bold mb-4">The OSINT Philosophy</h2><p class="text-[#94a3b8]">Our approach to digital reconnaissance.</p></div><div class="grid grid-cols-1 md:grid-cols-2 gap-6"><div class="philosophy-card"><h3><i class="bi bi-eye"></i> Transparency</h3><p>Gather data that is already public, then bring it into focus with clear and verifiable sources.</p></div><div class="philosophy-card"><h3><i class="bi bi-shield-check"></i> Ethics</h3><p>OSINT is powerful. Accuracy, accountability, and legal compliance sit at the core of every module.</p></div><div class="philosophy-card"><h3><i class="bi bi-lightning"></i> Efficiency</h3><p>Correlate scattered data points quickly into one tactical intelligence report.</p></div><div class="philosophy-card"><h3><i class="bi bi-unlock"></i> Accessibility</h3><p>High-grade reconnaissance should be approachable for learners, researchers, and defenders.</p></div></div></div></section>
<section id="mission" class="py-20 border-t border-white/5"><div class="container mx-auto px-6 max-w-4xl"><div class="glass-panel p-8 md:p-12 border border-[#7fff00]/20 relative overflow-hidden"><div class="absolute top-0 left-0 w-1 h-full bg-[#7fff00]"></div><div class="flex items-start gap-4"><div class="w-14 h-14 rounded-full bg-[#7fff00]/10 flex items-center justify-center text-[#7fff00] text-2xl shrink-0 border border-[#7fff00]/30"><i class="bi bi-shield-check"></i></div><div><h2 class="text-2xl font-bold text-white mb-3">Mission & Ethics</h2><p class="text-[#94a3b8] mb-4 leading-relaxed">The Evidence Room is a purpose-driven project focused on responsible OSINT. All demo data is educational, and real lookups use public sources.</p><ul class="space-y-2 text-sm text-[#94a3b8]"><li><i class="bi bi-check-circle-fill text-[#7fff00] mr-2"></i>Educational and defensive security purposes only</li><li><i class="bi bi-check-circle-fill text-[#7fff00] mr-2"></i>No harassment, doxxing, or stalking</li><li><i class="bi bi-check-circle-fill text-[#7fff00] mr-2"></i>Respect privacy laws and platform policies</li><li><i class="bi bi-check-circle-fill text-[#7fff00] mr-2"></i>Report vulnerabilities responsibly</li></ul></div></div></div></div></section>
<section id="opensource" class="py-20 bg-[#0a0a0f]/80 border-t border-white/5"><div class="container mx-auto px-6 text-center max-w-2xl"><div class="w-16 h-16 rounded-full bg-[#7fff00]/10 flex items-center justify-center text-[#7fff00] text-3xl mb-6 mx-auto"><i class="bi bi-github"></i></div><h2 class="text-3xl font-bold mb-4">Built with Transparency</h2><p class="text-[#94a3b8] mb-8">Open source by design, with a roadmap focused on responsible intelligence tooling.</p><div class="flex flex-col sm:flex-row gap-4 justify-center"><a href="https://github.com/Blue-Rangoon/The-Evidence-Room-OSINT" target="_blank" class="inline-flex items-center gap-2 px-6 py-3 bg-[#1f2937] text-white rounded border border-white/10 hover:bg-[#7fff00] hover:text-black transition"><i class="bi bi-github"></i> View on GitHub</a><a href="https://github.com/Blue-Rangoon/The-Evidence-Room-OSINT#%EF%B8%8F-roadmap" class="inline-flex items-center gap-2 px-6 py-3 text-[#7fff00] rounded border border-[#7fff00]/30 hover:bg-[#7fff00]/10 transition"><i class="bi bi-map"></i> Roadmap</a></div></div></section>
<footer class="border-t border-white/5 bg-[#15151e] pt-16 pb-8"><div class="container mx-auto px-6"><div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-12 mb-12"><div><div class="flex items-center gap-2 text-[#7fff00] font-bold text-lg tracking-wider mb-4"><i class="bi bi-terminal"></i><span class="text-white">THE EVIDENCE ROOM</span></div><p class="text-sm text-[#94a3b8] leading-relaxed mb-4">A tactical OSINT dashboard for professional investigators and security researchers.</p><div class="flex gap-3"><a href="https://github.com/Blue-Rangoon" class="social-link"><i class="bi bi-github"></i></a><a href="https://x.com/Blue_Rangoon" class="social-link"><i class="bi bi-twitter-x"></i></a><a href="https://linkedin.com/in/saad-ali-rizvi" class="social-link"><i class="bi bi-linkedin"></i></a><a href="#" class="social-link"><i class="bi bi-discord"></i></a></div></div><div><h4 class="footer-heading">Product</h4><ul class="footer-list"><li><a href="#features">Features</a></li><li><a href="#demo">Demo</a></li><li><a href="#">Documentation</a></li><li><a href="#">API Status</a></li></ul></div><div><h4 class="footer-heading">Legal</h4><ul class="footer-list"><li><a href="#">Privacy Policy</a></li><li><a href="#">Terms of Service</a></li><li><a href="#">Cookie Policy</a></li><li><a href="#mission">Compliance</a></li></ul></div><div><h4 class="footer-heading">Connect</h4><ul class="footer-list"><li><i class="bi bi-envelope text-[#7fff00] mr-2"></i><a href="mailto:contact@evidenceroom.io">contact@evidenceroom.io</a></li><li><i class="bi bi-geo-alt text-[#7fff00] mr-2"></i>Global Operations</li><li><i class="bi bi-shield-lock text-[#7fff00] mr-2"></i>PGP Key Available</li></ul></div></div><div class="border-t border-white/5 pt-6 flex flex-col md:flex-row justify-between items-center gap-4 text-xs text-[#94a3b8]/60"><div>(c) 2026 The Evidence Room. All rights reserved.</div><div class="flex items-center gap-2"><span class="w-2 h-2 rounded-full bg-[#7fff00] animate-pulse"></span> All systems operational</div></div></div></footer>
</div>
</body>
</html>