Hugging Face's logo

Spaces:
CrypticallyRequie
/
darkwebagent
Running

App Files Community
CrypticallyRequie commited on
Commit
a073047
·
verified ·
1 Parent(s): 4c526b1

Add 2 files

Browse files
Files changed (2) hide show
  1. README.md +7 -5
  2. index.html +728 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Darkwebagent
3
- emoji: 🐢
4
- colorFrom: blue
5
- colorTo: indigo
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: darkwebagent
3
+ emoji: 🐳
4
+ colorFrom: yellow
5
+ colorTo: gray
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,728 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Dark Web Monitoring Agent | Cybersecurity Platform</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
11
+
12
+ body {
13
+ font-family: 'Inter', sans-serif;
14
+ background-color: #0f172a;
15
+ color: #f8fafc;
16
+ }
17
+
18
+ .dark-bg {
19
+ background-color: #1e293b;
20
+ }
21
+
22
+ .darker-bg {
23
+ background-color: #0f172a;
24
+ }
25
+
26
+ .accent-border {
27
+ border-color: #3b82f6;
28
+ }
29
+
30
+ .critical {
31
+ background-color: #ef4444;
32
+ }
33
+
34
+ .high {
35
+ background-color: #f97316;
36
+ }
37
+
38
+ .medium {
39
+ background-color: #eab308;
40
+ }
41
+
42
+ .low {
43
+ background-color: #22c55e;
44
+ }
45
+
46
+ .info {
47
+ background-color: #3b82f6;
48
+ }
49
+
50
+ .glow {
51
+ box-shadow: 0 0 10px rgba(59, 130, 246, 0.5);
52
+ }
53
+
54
+ .pulse {
55
+ animation: pulse 2s infinite;
56
+ }
57
+
58
+ @keyframes pulse {
59
+ 0% {
60
+ box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.7);
61
+ }
62
+ 70% {
63
+ box-shadow: 0 0 0 10px rgba(59, 130, 246, 0);
64
+ }
65
+ 100% {
66
+ box-shadow: 0 0 0 0 rgba(59, 130, 246, 0);
67
+ }
68
+ }
69
+
70
+ .sidebar {
71
+ transition: all 0.3s ease;
72
+ }
73
+
74
+ .sidebar-item:hover {
75
+ background-color: #334155;
76
+ }
77
+
78
+ .data-table {
79
+ border-collapse: separate;
80
+ border-spacing: 0;
81
+ }
82
+
83
+ .data-table th {
84
+ position: sticky;
85
+ top: 0;
86
+ background-color: #1e293b;
87
+ }
88
+
89
+ .data-table tr:hover {
90
+ background-color: #334155;
91
+ }
92
+
93
+ .scrollbar-hide::-webkit-scrollbar {
94
+ display: none;
95
+ }
96
+
97
+ .scrollbar-hide {
98
+ -ms-overflow-style: none;
99
+ scrollbar-width: none;
100
+ }
101
+
102
+ .monitoring-indicator {
103
+ width: 10px;
104
+ height: 10px;
105
+ border-radius: 50%;
106
+ display: inline-block;
107
+ margin-right: 5px;
108
+ }
109
+
110
+ .active-monitoring {
111
+ background-color: #22c55e;
112
+ animation: pulse 1.5s infinite;
113
+ }
114
+
115
+ .inactive-monitoring {
116
+ background-color: #64748b;
117
+ }
118
+
119
+ .risk-badge {
120
+ padding: 2px 8px;
121
+ border-radius: 12px;
122
+ font-size: 12px;
123
+ font-weight: 600;
124
+ }
125
+
126
+ .source-badge {
127
+ padding: 2px 8px;
128
+ border-radius: 12px;
129
+ font-size: 12px;
130
+ font-weight: 600;
131
+ background-color: #334155;
132
+ }
133
+
134
+ .chart-container {
135
+ position: relative;
136
+ height: 300px;
137
+ }
138
+
139
+ .evidence-card {
140
+ transition: all 0.2s ease;
141
+ }
142
+
143
+ .evidence-card:hover {
144
+ transform: translateY(-2px);
145
+ box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3);
146
+ }
147
+
148
+ .tooltip {
149
+ position: relative;
150
+ display: inline-block;
151
+ }
152
+
153
+ .tooltip .tooltiptext {
154
+ visibility: hidden;
155
+ width: 200px;
156
+ background-color: #1e293b;
157
+ color: #fff;
158
+ text-align: center;
159
+ border-radius: 6px;
160
+ padding: 5px;
161
+ position: absolute;
162
+ z-index: 1;
163
+ bottom: 125%;
164
+ left: 50%;
165
+ margin-left: -100px;
166
+ opacity: 0;
167
+ transition: opacity 0.3s;
168
+ border: 1px solid #3b82f6;
169
+ }
170
+
171
+ .tooltip:hover .tooltiptext {
172
+ visibility: visible;
173
+ opacity: 1;
174
+ }
175
+ </style>
176
+ </head>
177
+ <body>
178
+ <div class="flex h-screen overflow-hidden">
179
+ <!-- Sidebar -->
180
+ <div class="sidebar w-64 dark-bg border-r border-gray-700 flex flex-col">
181
+ <div class="p-4 border-b border-gray-700 flex items-center">
182
+ <div class="w-10 h-10 rounded-full bg-blue-500 flex items-center justify-center mr-3">
183
+ <i class="fas fa-shield-alt text-white"></i>
184
+ </div>
185
+ <h1 class="text-xl font-bold">DarkWeb Sentinel</h1>
186
+ </div>
187
+
188
+ <div class="flex-1 overflow-y-auto scrollbar-hide">
189
+ <div class="p-4">
190
+ <div class="mb-6">
191
+ <h2 class="text-sm uppercase font-semibold text-gray-400 mb-3">Monitoring</h2>
192
+ <ul>
193
+ <li class="sidebar-item rounded-lg mb-1">
194
+ <a href="#" class="flex items-center p-2 text-blue-400 font-medium">
195
+ <i class="fas fa-tachometer-alt mr-3"></i>
196
+ Dashboard
197
+ </a>
198
+ </li>
199
+ <li class="sidebar-item rounded-lg mb-1">
200
+ <a href="#" class="flex items-center p-2 text-gray-300 hover:text-white">
201
+ <i class="fas fa-bell mr-3"></i>
202
+ Alerts
203
+ <span class="ml-auto bg-red-500 text-white text-xs font-bold px-2 py-1 rounded-full">12</span>
204
+ </a>
205
+ </li>
206
+ <li class="sidebar-item rounded-lg mb-1">
207
+ <a href="#" class="flex items-center p-2 text-gray-300 hover:text-white">
208
+ <i class="fas fa-search mr-3"></i>
209
+ Threat Hunting
210
+ </a>
211
+ </li>
212
+ <li class="sidebar-item rounded-lg mb-1">
213
+ <a href="#" class="flex items-center p-2 text-gray-300 hover:text-white">
214
+ <i class="fas fa-chart-line mr-3"></i>
215
+ Analytics
216
+ </a>
217
+ </li>
218
+ </ul>
219
+ </div>
220
+
221
+ <div class="mb-6">
222
+ <h2 class="text-sm uppercase font-semibold text-gray-400 mb-3">Configuration</h2>
223
+ <ul>
224
+ <li class="sidebar-item rounded-lg mb-1">
225
+ <a href="#" class="flex items-center p-2 text-gray-300 hover:text-white">
226
+ <i class="fas fa-cog mr-3"></i>
227
+ Monitoring Settings
228
+ </a>
229
+ </li>
230
+ <li class="sidebar-item rounded-lg mb-1">
231
+ <a href="#" class="flex items-center p-2 text-gray-300 hover:text-white">
232
+ <i class="fas fa-filter mr-3"></i>
233
+ Alert Rules
234
+ </a>
235
+ </li>
236
+ <li class="sidebar-item rounded-lg mb-1">
237
+ <a href="#" class="flex items-center p-2 text-gray-300 hover:text-white">
238
+ <i class="fas fa-project-diagram mr-3"></i>
239
+ Integrations
240
+ </a>
241
+ </li>
242
+ </ul>
243
+ </div>
244
+
245
+ <div class="mb-6">
246
+ <h2 class="text-sm uppercase font-semibold text-gray-400 mb-3">Data</h2>
247
+ <ul>
248
+ <li class="sidebar-item rounded-lg mb-1">
249
+ <a href="#" class="flex items-center p-2 text-gray-300 hover:text-white">
250
+ <i class="fas fa-database mr-3"></i>
251
+ Evidence Browser
252
+ </a>
253
+ </li>
254
+ <li class="sidebar-item rounded-lg mb-1">
255
+ <a href="#" class="flex items-center p-2 text-gray-300 hover:text-white">
256
+ <i class="fas fa-file-alt mr-3"></i>
257
+ Reports
258
+ </a>
259
+ </li>
260
+ <li class="sidebar-item rounded-lg mb-1">
261
+ <a href="#" class="flex items-center p-2 text-gray-300 hover:text-white">
262
+ <i class="fas fa-history mr-3"></i>
263
+ Historical Data
264
+ </a>
265
+ </li>
266
+ </ul>
267
+ </div>
268
+ </div>
269
+ </div>
270
+
271
+ <div class="p-4 border-t border-gray-700">
272
+ <div class="flex items-center">
273
+ <div class="w-8 h-8 rounded-full bg-gray-600 flex items-center justify-center mr-2">
274
+ <i class="fas fa-user text-sm text-white"></i>
275
+ </div>
276
+ <div>
277
+ <p class="text-sm font-medium">Security Analyst</p>
278
+ <p class="text-xs text-gray-400">[email protected]</p>
279
+ </div>
280
+ </div>
281
+ </div>
282
+ </div>
283
+
284
+ <!-- Main Content -->
285
+ <div class="flex-1 overflow-auto">
286
+ <!-- Header -->
287
+ <header class="dark-bg border-b border-gray-700 p-4 flex items-center justify-between">
288
+ <h2 class="text-xl font-semibold">Dark Web Monitoring Dashboard</h2>
289
+
290
+ <div class="flex items-center space-x-4">
291
+ <div class="relative">
292
+ <input type="text" placeholder="Search threats..." class="bg-gray-800 border border-gray-700 rounded-lg px-4 py-2 pl-10 focus:outline-none focus:ring-1 focus:ring-blue-500 w-64">
293
+ <i class="fas fa-search absolute left-3 top-3 text-gray-400"></i>
294
+ </div>
295
+
296
+ <button class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-lg flex items-center">
297
+ <i class="fas fa-plus mr-2"></i>
298
+ New Scan
299
+ </button>
300
+
301
+ <div class="tooltip">
302
+ <i class="fas fa-question-circle text-gray-400 hover:text-blue-400 cursor-pointer text-xl"></i>
303
+ <span class="tooltiptext">DarkWeb Sentinel continuously monitors underground forums, marketplaces, and paste sites for threats to your organization.</span>
304
+ </div>
305
+ </div>
306
+ </header>
307
+
308
+ <!-- Dashboard Content -->
309
+ <main class="p-6">
310
+ <!-- Status Cards -->
311
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-6">
312
+ <div class="dark-bg rounded-xl p-5 glow">
313
+ <div class="flex justify-between items-start">
314
+ <div>
315
+ <p class="text-gray-400 text-sm">Active Monitors</p>
316
+ <h3 class="text-2xl font-bold mt-1">24</h3>
317
+ </div>
318
+ <div class="p-2 rounded-lg bg-blue-900 bg-opacity-30">
319
+ <i class="fas fa-eye text-blue-400"></i>
320
+ </div>
321
+ </div>
322
+ <div class="mt-4 flex items-center">
323
+ <span class="monitoring-indicator active-monitoring"></span>
324
+ <span class="text-sm text-gray-300">All systems operational</span>
325
+ </div>
326
+ </div>
327
+
328
+ <div class="dark-bg rounded-xl p-5">
329
+ <div class="flex justify-between items-start">
330
+ <div>
331
+ <p class="text-gray-400 text-sm">Critical Alerts</p>
332
+ <h3 class="text-2xl font-bold mt-1">5</h3>
333
+ </div>
334
+ <div class="p-2 rounded-lg bg-red-900 bg-opacity-30">
335
+ <i class="fas fa-exclamation-triangle text-red-400"></i>
336
+ </div>
337
+ </div>
338
+ <div class="mt-4">
339
+ <span class="text-sm text-gray-300">+2 since yesterday</span>
340
+ </div>
341
+ </div>
342
+
343
+ <div class="dark-bg rounded-xl p-5">
344
+ <div class="flex justify-between items-start">
345
+ <div>
346
+ <p class="text-gray-400 text-sm">Credentials Found</p>
347
+ <h3 class="text-2xl font-bold mt-1">87</h3>
348
+ </div>
349
+ <div class="p-2 rounded-lg bg-yellow-900 bg-opacity-30">
350
+ <i class="fas fa-key text-yellow-400"></i>
351
+ </div>
352
+ </div>
353
+ <div class="mt-4">
354
+ <span class="text-sm text-gray-300">12 new in last 24h</span>
355
+ </div>
356
+ </div>
357
+
358
+ <div class="dark-bg rounded-xl p-5">
359
+ <div class="flex justify-between items-start">
360
+ <div>
361
+ <p class="text-gray-400 text-sm">Data Leaks</p>
362
+ <h3 class="text-2xl font-bold mt-1">14</h3>
363
+ </div>
364
+ <div class="p-2 rounded-lg bg-purple-900 bg-opacity-30">
365
+ <i class="fas fa-database text-purple-400"></i>
366
+ </div>
367
+ </div>
368
+ <div class="mt-4">
369
+ <span class="text-sm text-gray-300">3 new this week</span>
370
+ </div>
371
+ </div>
372
+ </div>
373
+
374
+ <!-- Threat Overview -->
375
+ <div class="grid grid-cols-1 lg:grid-cols-3 gap-6 mb-6">
376
+ <!-- Recent Alerts -->
377
+ <div class="dark-bg rounded-xl p-5 lg:col-span-1">
378
+ <div class="flex justify-between items-center mb-4">
379
+ <h3 class="font-semibold">Recent Alerts</h3>
380
+ <a href="#" class="text-blue-400 text-sm">View All</a>
381
+ </div>
382
+
383
+ <div class="space-y-4">
384
+ <div class="flex items-start p-3 rounded-lg bg-gray-800">
385
+ <div class="mr-3 mt-1">
386
+ <div class="w-8 h-8 rounded-full bg-red-500 flex items-center justify-center">
387
+ <i class="fas fa-exclamation text-white text-sm"></i>
388
+ </div>
389
+ </div>
390
+ <div>
391
+ <p class="font-medium">CEO credentials found on paste site</p>
392
+ <p class="text-sm text-gray-400 mt-1">15 minutes ago</p>
393
+ <span class="risk-badge critical mt-1">Critical</span>
394
+ <span class="source-badge ml-2">Pastebin</span>
395
+ </div>
396
+ </div>
397
+
398
+ <div class="flex items-start p-3 rounded-lg bg-gray-800">
399
+ <div class="mr-3 mt-1">
400
+ <div class="w-8 h-8 rounded-full bg-orange-500 flex items-center justify-center">
401
+ <i class="fas fa-user-secret text-white text-sm"></i>
402
+ </div>
403
+ </div>
404
+ <div>
405
+ <p class="font-medium">Discussion about attacking our API</p>
406
+ <p class="text-sm text-gray-400 mt-1">2 hours ago</p>
407
+ <span class="risk-badge high mt-1">High</span>
408
+ <span class="source-badge ml-2">HackForums</span>
409
+ </div>
410
+ </div>
411
+
412
+ <div class="flex items-start p-3 rounded-lg bg-gray-800">
413
+ <div class="mr-3 mt-1">
414
+ <div class="w-8 h-8 rounded-full bg-yellow-500 flex items-center justify-center">
415
+ <i class="fas fa-key text-white text-sm"></i>
416
+ </div>
417
+ </div>
418
+ <div>
419
+ <p class="font-medium">Employee password dump detected</p>
420
+ <p class="text-sm text-gray-400 mt-1">5 hours ago</p>
421
+ <span class="risk-badge medium mt-1">Medium</span>
422
+ <span class="source-badge ml-2">RaidForums</span>
423
+ </div>
424
+ </div>
425
+
426
+ <div class="flex items-start p-3 rounded-lg bg-gray-800">
427
+ <div class="mr-3 mt-1">
428
+ <div class="w-8 h-8 rounded-full bg-blue-500 flex items-center justify-center">
429
+ <i class="fas fa-info-circle text-white text-sm"></i>
430
+ </div>
431
+ </div>
432
+ <div>
433
+ <p class="font-medium">Mentions in ransomware discussion</p>
434
+ <p class="text-sm text-gray-400 mt-1">Yesterday</p>
435
+ <span class="risk-badge info mt-1">Info</span>
436
+ <span class="source-badge ml-2">Telegram</span>
437
+ </div>
438
+ </div>
439
+ </div>
440
+ </div>
441
+
442
+ <!-- Threat Map -->
443
+ <div class="dark-bg rounded-xl p-5 lg:col-span-2">
444
+ <div class="flex justify-between items-center mb-4">
445
+ <h3 class="font-semibold">Threat Activity Map</h3>
446
+ <div class="flex space-x-2">
447
+ <button class="text-xs bg-gray-700 hover:bg-gray-600 px-3 py-1 rounded">Last 24h</button>
448
+ <button class="text-xs bg-gray-700 hover:bg-gray-600 px-3 py-1 rounded">Week</button>
449
+ <button class="text-xs bg-gray-700 hover:bg-gray-600 px-3 py-1 rounded">Month</button>
450
+ </div>
451
+ </div>
452
+
453
+ <div class="bg-gray-800 rounded-lg p-4 h-64 flex items-center justify-center">
454
+ <div class="text-center">
455
+ <i class="fas fa-globe-americas text-4xl text-gray-600 mb-2"></i>
456
+ <p class="text-gray-400">Threat activity visualization</p>
457
+ <p class="text-sm text-gray-500">(Interactive map would display here)</p>
458
+ </div>
459
+ </div>
460
+
461
+ <div class="grid grid-cols-3 gap-4 mt-4">
462
+ <div class="bg-gray-800 rounded-lg p-3">
463
+ <p class="text-gray-400 text-sm">Top Source</p>
464
+ <p class="font-medium">Pastebin</p>
465
+ <p class="text-sm text-gray-400">42% of alerts</p>
466
+ </div>
467
+ <div class="bg-gray-800 rounded-lg p-3">
468
+ <p class="text-gray-400 text-sm">Top Threat</p>
469
+ <p class="font-medium">Credential Leaks</p>
470
+ <p class="text-sm text-gray-400">68 occurrences</p>
471
+ </div>
472
+ <div class="bg-gray-800 rounded-lg p-3">
473
+ <p class="text-gray-400 text-sm">Top Language</p>
474
+ <p class="font-medium">English</p>
475
+ <p class="text-sm text-gray-400">82% of content</p>
476
+ </div>
477
+ </div>
478
+ </div>
479
+ </div>
480
+
481
+ <!-- Evidence & Analytics -->
482
+ <div class="grid grid-cols-1 lg:grid-cols-3 gap-6 mb-6">
483
+ <!-- Recent Evidence -->
484
+ <div class="dark-bg rounded-xl p-5 lg:col-span-2">
485
+ <div class="flex justify-between items-center mb-4">
486
+ <h3 class="font-semibold">Recent Evidence</h3>
487
+ <a href="#" class="text-blue-400 text-sm">View All</a>
488
+ </div>
489
+
490
+ <div class="overflow-x-auto">
491
+ <table class="w-full data-table">
492
+ <thead>
493
+ <tr class="text-left text-sm text-gray-400 border-b border-gray-700">
494
+ <th class="pb-3 pl-2">Timestamp</th>
495
+ <th class="pb-3">Type</th>
496
+ <th class="pb-3">Source</th>
497
+ <th class="pb-3">Content Preview</th>
498
+ <th class="pb-3 pr-2">Risk</th>
499
+ </tr>
500
+ </thead>
501
+ <tbody>
502
+ <tr class="border-b border-gray-700 hover:bg-gray-800 cursor-pointer">
503
+ <td class="py-3 pl-2 text-sm">2023-06-15 14:32</td>
504
+ <td class="py-3">
505
+ <span class="source-badge">
506
+ <i class="fas fa-key mr-1"></i> Credentials
507
+ </span>
508
+ </td>
509
+ <td class="py-3">Pastebin #Xk29d</td>
510
+ <td class="py-3 text-sm text-gray-300">"[email protected]:Password123"</td>
511
+ <td class="py-3 pr-2">
512
+ <span class="risk-badge critical">Critical</span>
513
+ </td>
514
+ </tr>
515
+ <tr class="border-b border-gray-700 hover:bg-gray-800 cursor-pointer">
516
+ <td class="py-3 pl-2 text-sm">2023-06-15 11:18</td>
517
+ <td class="py-3">
518
+ <span class="source-badge">
519
+ <i class="fas fa-comments mr-1"></i> Discussion
520
+ </span>
521
+ </td>
522
+ <td class="py-3">HackForums</td>
523
+ <td class="py-3 text-sm text-gray-300">"Their API has rate limiting but we found..."</td>
524
+ <td class="py-3 pr-2">
525
+ <span class="risk-badge high">High</span>
526
+ </td>
527
+ </tr>
528
+ <tr class="border-b border-gray-700 hover:bg-gray-800 cursor-pointer">
529
+ <td class="py-3 pl-2 text-sm">2023-06-14 19:45</td>
530
+ <td class="py-3">
531
+ <span class="source-badge">
532
+ <i class="fas fa-database mr-1"></i> Data Leak
533
+ </span>
534
+ </td>
535
+ <td class="py-3">RaidForums</td>
536
+ <td class="py-3 text-sm text-gray-300">"CompanyX customer emails 2023"</td>
537
+ <td class="py-3 pr-2">
538
+ <span class="risk-badge medium">Medium</span>
539
+ </td>
540
+ </tr>
541
+ <tr class="border-b border-gray-700 hover:bg-gray-800 cursor-pointer">
542
+ <td class="py-3 pl-2 text-sm">2023-06-14 08:12</td>
543
+ <td class="py-3">
544
+ <span class="source-badge">
545
+ <i class="fas fa-shopping-cart mr-1"></i> Marketplace
546
+ </span>
547
+ </td>
548
+ <td class="py-3">DarkMarket</td>
549
+ <td class="py-3 text-sm text-gray-300">"Selling access to CompanyX VPN"</td>
550
+ <td class="py-3 pr-2">
551
+ <span class="risk-badge critical">Critical</span>
552
+ </td>
553
+ </tr>
554
+ <tr class="hover:bg-gray-800 cursor-pointer">
555
+ <td class="py-3 pl-2 text-sm">2023-06-13 22:07</td>
556
+ <td class="py-3">
557
+ <span class="source-badge">
558
+ <i class="fas fa-comment-alt mr-1"></i> Chatter
559
+ </span>
560
+ </td>
561
+ <td class="py-3">Telegram</td>
562
+ <td class="py-3 text-sm text-gray-300">"Their security team is pretty active..."</td>
563
+ <td class="py-3 pr-2">
564
+ <span class="risk-badge info">Info</span>
565
+ </td>
566
+ </tr>
567
+ </tbody>
568
+ </table>
569
+ </div>
570
+ </div>
571
+
572
+ <!-- Monitoring Analytics -->
573
+ <div class="dark-bg rounded-xl p-5">
574
+ <div class="flex justify-between items-center mb-4">
575
+ <h3 class="font-semibold">Monitoring Analytics</h3>
576
+ <button class="text-blue-400 text-sm">Export</button>
577
+ </div>
578
+
579
+ <div class="bg-gray-800 rounded-lg p-4 mb-4">
580
+ <div class="flex justify-between items-center mb-2">
581
+ <p class="text-sm text-gray-400">Alerts by Severity</p>
582
+ <p class="text-xs text-gray-500">Last 7 days</p>
583
+ </div>
584
+ <div class="chart-container">
585
+ <!-- Chart would be rendered here -->
586
+ <div class="h-full flex items-center justify-center text-gray-500">
587
+ <div class="text-center">
588
+ <i class="fas fa-chart-pie text-4xl mb-2"></i>
589
+ <p>Severity distribution chart</p>
590
+ </div>
591
+ </div>
592
+ </div>
593
+ </div>
594
+
595
+ <div class="bg-gray-800 rounded-lg p-4">
596
+ <div class="flex justify-between items-center mb-2">
597
+ <p class="text-sm text-gray-400">Top Monitored Terms</p>
598
+ <p class="text-xs text-gray-500">By match count</p>
599
+ </div>
600
+ <div class="space-y-3">
601
+ <div>
602
+ <div class="flex justify-between text-sm mb-1">
603
+ <span>"company.com"</span>
604
+ <span class="font-medium">142</span>
605
+ </div>
606
+ <div class="w-full bg-gray-700 rounded-full h-1.5">
607
+ <div class="bg-blue-500 h-1.5 rounded-full" style="width: 90%"></div>
608
+ </div>
609
+ </div>
610
+ <div>
611
+ <div class="flex justify-between text-sm mb-1">
612
+ <span>"CompanyX"</span>
613
+ <span class="font-medium">87</span>
614
+ </div>
615
+ <div class="w-full bg-gray-700 rounded-full h-1.5">
616
+ <div class="bg-blue-500 h-1.5 rounded-full" style="width: 60%"></div>
617
+ </div>
618
+ </div>
619
+ <div>
620
+ <div class="flex justify-between text-sm mb-1">
621
+ <span>"admin@"</span>
622
+ <span class="font-medium">65</span>
623
+ </div>
624
+ <div class="w-full bg-gray-700 rounded-full h-1.5">
625
+ <div class="bg-blue-500 h-1.5 rounded-full" style="width: 45%"></div>
626
+ </div>
627
+ </div>
628
+ <div>
629
+ <div class="flex justify-between text-sm mb-1">
630
+ <span>"prod-api"</span>
631
+ <span class="font-medium">32</span>
632
+ </div>
633
+ <div class="w-full bg-gray-700 rounded-full h-1.5">
634
+ <div class="bg-blue-500 h-1.5 rounded-full" style="width: 25%"></div>
635
+ </div>
636
+ </div>
637
+ <div>
638
+ <div class="flex justify-between text-sm mb-1">
639
+ <span>"vpn-access"</span>
640
+ <span class="font-medium">18</span>
641
+ </div>
642
+ <div class="w-full bg-gray-700 rounded-full h-1.5">
643
+ <div class="bg-blue-500 h-1.5 rounded-full" style="width: 15%"></div>
644
+ </div>
645
+ </div>
646
+ </div>
647
+ </div>
648
+ </div>
649
+ </div>
650
+
651
+ <!-- Quick Actions -->
652
+ <div class="dark-bg rounded-xl p-5 mb-6">
653
+ <h3 class="font-semibold mb-4">Quick Actions</h3>
654
+ <div class="grid grid-cols-2 md:grid-cols-4 gap-4">
655
+ <button class="bg-gray-800 hover:bg-gray-700 rounded-lg p-4 flex flex-col items-center">
656
+ <div class="w-10 h-10 rounded-full bg-red-500 bg-opacity-20 flex items-center justify-center mb-2">
657
+ <i class="fas fa-user-lock text-red-400"></i>
658
+ </div>
659
+ <span class="text-sm text-center">Force Password Reset</span>
660
+ </button>
661
+ <button class="bg-gray-800 hover:bg-gray-700 rounded-lg p-4 flex flex-col items-center">
662
+ <div class="w-10 h-10 rounded-full bg-blue-500 bg-opacity-20 flex items-center justify-center mb-2">
663
+ <i class="fas fa-search-plus text-blue-400"></i>
664
+ </div>
665
+ <span class="text-sm text-center">Deep Scan</span>
666
+ </button>
667
+ <button class="bg-gray-800 hover:bg-gray-700 rounded-lg p-4 flex flex-col items-center">
668
+ <div class="w-10 h-10 rounded-full bg-purple-500 bg-opacity-20 flex items-center justify-center mb-2">
669
+ <i class="fas fa-file-export text-purple-400"></i>
670
+ </div>
671
+ <span class="text-sm text-center">Generate Report</span>
672
+ </button>
673
+ <button class="bg-gray-800 hover:bg-gray-700 rounded-lg p-4 flex flex-col items-center">
674
+ <div class="w-10 h-10 rounded-full bg-green-500 bg-opacity-20 flex items-center justify-center mb-2">
675
+ <i class="fas fa-bell text-green-400"></i>
676
+ </div>
677
+ <span class="text-sm text-center">Alert Settings</span>
678
+ </button>
679
+ </div>
680
+ </div>
681
+ </main>
682
+ </div>
683
+ </div>
684
+
685
+ <script>
686
+ // Simulate real-time monitoring status
687
+ setInterval(() => {
688
+ const indicator = document.querySelector('.monitoring-indicator');
689
+ indicator.classList.toggle('pulse');
690
+ }, 3000);
691
+
692
+ // Sample data for charts (in a real app, this would come from an API)
693
+ const monitoringData = {
694
+ terms: [
695
+ { term: '"company.com"', count: 142 },
696
+ { term: '"CompanyX"', count: 87 },
697
+ { term: '"admin@"', count: 65 },
698
+ { term: '"prod-api"', count: 32 },
699
+ { term: '"vpn-access"', count: 18 }
700
+ ],
701
+ alerts: [
702
+ { severity: 'Critical', count: 5 },
703
+ { severity: 'High', count: 12 },
704
+ { severity: 'Medium', count: 23 },
705
+ { severity: 'Low', count: 8 },
706
+ { severity: 'Info', count: 15 }
707
+ ]
708
+ };
709
+
710
+ // Simple interaction for evidence table
711
+ document.querySelectorAll('.data-table tr').forEach(row => {
712
+ row.addEventListener('click', function() {
713
+ // In a real app, this would open a modal with full evidence details
714
+ console.log('Evidence selected:', this.cells[3].textContent.trim());
715
+ });
716
+ });
717
+
718
+ // Quick actions buttons
719
+ document.querySelectorAll('.quick-action').forEach(button => {
720
+ button.addEventListener('click', function() {
721
+ const action = this.dataset.action;
722
+ alert(`Initiating ${action}...`);
723
+ // In a real app, this would call the appropriate API endpoint
724
+ });
725
+ });
726
+ </script>
727
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=CrypticallyRequie/darkwebagent" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
728
+ </html>