spectreworks / index.html
00Boobs00's picture
The aspiration of this groundbreaking project is to meticulously design and deploy a profoundly advanced embedded system—an extraordinary conversational assistant fueled by the power of a Large Language Model (LLM). Picture this: a cutting-edge marvel that functions not merely as a setup wizard but embodies a deep reservoir of contextual understanding, brimming with potential. This isn't just another digital help; it’s like having the wisdom of the ages at your fingertips, an intuitive automation conduit for a myriad of Natural Language Processing (NLP) tasks, and an agile adversarial agent, dynamically tackling an expansive landscape of complex scenarios with flair.
e0ef379 verified
<!DOCTYPE html>
<html lang="en" class="dark">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SpectreWorks | The Digital Ghost</title>
<link rel="icon" type="image/x-icon" href="https://cdn-icons-png.flaticon.com/512/6104/6104526.png">
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
<script src="https://unpkg.com/feather-icons"></script>
<link rel="stylesheet" href="style.css">
<script>
tailwind.config = {
darkMode: 'class',
theme: {
extend: {
colors: {
primary: '#22c55e', // green-500
secondary: '#f97316', // orange-500
dark: '#0f172a', // slate-900
darker: '#020617', // slate-950
surface: '#1e293b', // slate-800
}
}
}
}
</script>
</head>
<body class="bg-darker text-gray-300 font-sans antialiased overflow-x-hidden">
<!-- Navbar Component -->
<spectre-navbar></spectre-navbar>
<!-- Main Container -->
<div class="container mx-auto px-4 py-8 flex flex-col lg:flex-row gap-6">
<!-- Sidebar Component -->
<div class="w-full lg:w-1/4">
<spectre-sidebar></spectre-sidebar>
</div>
<!-- Main Content Area -->
<main class="w-full lg:w-3/4 space-y-8">
<!-- Hero Section -->
<section class="relative rounded-2xl overflow-hidden bg-surface border border-gray-700 shadow-2xl">
<div class="absolute inset-0 bg-gradient-to-r from-primary/10 to-secondary/10"></div>
<div class="absolute top-0 right-0 p-4 opacity-20">
<i data-feather="cpu" class="w-64 h-64 text-primary"></i>
</div>
<div class="relative p-8 md:p-12">
<span class="inline-block py-1 px-3 rounded-full bg-primary/20 text-primary text-xs font-bold tracking-wider mb-4 border border-primary/30">V 4.2.0 // AUTO-UPDATED</span>
<h1 class="text-4xl md:text-5xl font-extrabold text-white mb-4">Become a <span class="text-transparent bg-clip-text bg-gradient-to-r from-primary to-secondary">Digital Ghost</span>.</h1>
<p class="text-lg text-gray-400 max-w-2xl mb-8">
Navigate the gig economy with avant-garde OSINT capabilities. Our automated AI module ensures you remain invisible while extracting critical insights.
</p>
<div class="flex gap-4">
<a href="#" class="px-6 py-3 bg-primary hover:bg-green-600 text-black font-bold rounded-lg transition-all flex items-center gap-2 shadow-[0_0_15px_rgba(34,197,94,0.5)]">
<i data-feather="play"></i> Initialize OSINT
</a>
<a href="#" class="px-6 py-3 bg-surface hover:bg-gray-700 border border-gray-600 text-white font-bold rounded-lg transition-all flex items-center gap-2">
<i data-feather="shield"></i> Stealth Protocol
</a>
</div>
</div>
</section>
<!-- Dashboard Grid -->
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<!-- OSINT Module -->
<div class="bg-surface rounded-xl p-6 border border-gray-700 shadow-lg relative overflow-hidden group">
<div class="flex justify-between items-center mb-6">
<div>
<h2 class="text-xl font-bold text-white flex items-center gap-2">
<i data-feather="activity" class="text-primary"></i> Live OSINT Feed
</h2>
<p class="text-xs text-gray-500 mt-1">NVD • CISA • URLhaus • MalwareBazaar • GitHub • USGS • NOAA • CoinGecko</p>
</div>
<div class="flex items-center gap-3">
<button onclick="window.refreshOSINT()" class="text-xs px-3 py-1.5 rounded bg-primary/20 text-primary hover:bg-primary/30 transition flex items-center gap-1">
<i data-feather="refresh-cw" class="w-3 h-3"></i> Refresh
</button>
<span class="animate-pulse w-3 h-3 bg-primary rounded-full shadow-[0_0_10px_#22c55e]"></span>
</div>
</div>
<div id="osint-stream" class="space-y-3 max-h-96 overflow-y-auto pr-2 custom-scrollbar">
<div class="text-center py-8 text-gray-500 text-sm">
<i data-feather="loader" class="animate-spin inline-block w-5 h-5 mb-2"></i>
<p>Initializing intelligence feed...</p>
</div>
</div>
</div>
<!-- Android Security Intelligence -->
<div class="bg-surface rounded-xl p-6 border border-gray-700 shadow-lg">
<div class="flex justify-between items-center mb-6">
<h2 class="text-xl font-bold text-white flex items-center gap-2">
<i data-feather="shield" class="text-secondary"></i> Android Security Intel
</h2>
<a href="https://nvd.nist.gov/vuln/search/results?is_cve_id_search=true&cve_id=CVE-" target="_blank" class="text-xs bg-secondary/20 text-secondary px-2 py-1 rounded border border-secondary/30 hover:bg-secondary/30 transition">VIEW NVD</a>
</div>
<div id="android-security-feed" class="space-y-4">
<div class="text-center py-4 text-gray-500 text-sm">
<i data-feather="loader" class="animate-spin inline-block w-4 h-4"></i>
Loading Android security data...
</div>
</div>
</div>
</div>
<!-- Stealth Status -->
<spectre-stealth-panel></spectre-stealth-panel>
<!-- Real-Time Risk Assessment -->
<div class="bg-gradient-to-r from-gray-900 to-gray-800 rounded-xl p-6 border-l-4 border-secondary flex items-start gap-4">
<i data-feather="shield" class="text-secondary mt-1"></i>
<div class="flex-1">
<h3 class="text-white font-bold text-lg flex items-center gap-2">
Real-Time Threat Intelligence
<span class="text-xs px-2 py-0.5 rounded bg-green-900/50 text-green-400 animate-pulse">LIVE</span>
<span class="text-[10px] text-gray-600 ml-2">Press Ctrl+R to refresh</span>
</h3>
<p class="text-sm text-gray-400 mt-1" id="threat-summary">
Initializing threat analysis from NIST NVD, CISA KEV, URLhaus, MalwareBazaar, and multiple intelligence sources...
</p>
<div class="mt-3 flex items-center gap-4 text-xs">
<div class="flex items-center gap-2">
<span class="w-2 h-2 rounded-full bg-red-500"></span>
<span class="text-gray-500">Active Exploits</span>
</div>
<div class="flex items-center gap-2">
<span class="w-2 h-2 rounded-full bg-orange-500"></span>
<span class="text-gray-500">Critical CVEs</span>
</div>
<div class="flex items-center gap-2">
<span class="w-2 h-2 rounded-full bg-purple-500"></span>
<span class="text-gray-500">Malware URLs</span>
</div>
<div class="flex items-center gap-2">
<span class="w-2 h-2 rounded-full bg-green-500"></span>
<span class="text-gray-500">Intelligence</span>
</div>
</div>
</div>
</div>
</main>
</div>
<!-- AI Chat Assistant -->
<chat-assistant></chat-assistant>
<!-- Web Components Scripts -->
<script src="components/navbar.js"></script>
<script src="components/sidebar.js"></script>
<script src="components/stealth-panel.js"></script>
<script src="components/chat-assistant.js"></script>
<!-- Main Logic -->
<script src="script.js"></script>
<script>feather.replace();</script>
<script src="https://huggingface.co/deepsite/deepsite-badge.js"></script>
</body>
</html>