Download index.html from 00Boobs00/operation-void-control: direct link, hf CLI and curl.
- Browser
- Download file 31.3 kB
-
https://huggingface.co/spaces/00Boobs00/operation-void-control/resolve/main/index.html
- Command line
-
hf download hf://spaces/00Boobs00/operation-void-control/index.html
-
curl -L -o index.html https://huggingface.co/spaces/00Boobs00/operation-void-control/resolve/main/index.html
31.3 kB
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Operation Void Control | Clawdbot C2</title> | |
| <link rel="stylesheet" href="style.css"> | |
| <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> | |
| <script> | |
| tailwind.config = { | |
| theme: { | |
| extend: { | |
| colors: { | |
| void: { | |
| 900: '#050505', | |
| 800: '#0a0a0a', | |
| 700: '#121212', | |
| }, | |
| neon: { | |
| green: '#22c55e', | |
| orange: '#f97316', | |
| gold: '#ffd700', | |
| red: '#ef4444', | |
| } | |
| }, | |
| fontFamily: { | |
| mono: ['ui-monospace', 'SFMono-Regular', 'Menlo', 'Monaco', 'Consolas', "Liberation Mono", "Courier New", 'monospace'], | |
| } | |
| } | |
| } | |
| } | |
| </script> | |
| </head> | |
| <body class="bg-void-900 text-gray-300 font-sans antialiased overflow-hidden h-screen flex flex-col relative"> | |
| <!-- Sacred Geometry Background Layer --> | |
| <div class="absolute inset-0 z-0 pointer-events-none opacity-[0.03] pattern-metatron"></div> | |
| <div class="absolute inset-0 z-0 pointer-events-none opacity-[0.05] pattern-flower"></div> | |
| <!-- Top Navigation --> | |
| <custom-navbar></custom-navbar> | |
| <div class="flex flex-1 overflow-hidden relative z-10"> | |
| <!-- Sidebar --> | |
| <custom-sidebar></custom-sidebar> | |
| <!-- Main Content --> | |
| <main class="flex-1 overflow-y-auto p-6 md:p-8 scroll-smooth"> | |
| <header class="mb-8 border-b border-gray-800 pb-4 flex justify-between items-end"> | |
| <div> | |
| <h1 class="text-3xl font-bold text-white tracking-wider uppercase font-mono">Tactical Dashboard</h1> | |
| <p class="text-sm text-neon-green mt-1 flex items-center gap-2"> | |
| <span class="w-2 h-2 rounded-full bg-neon-green animate-pulse"></span> | |
| SYSTEM ONLINE // CLAWDBOT v3.2.0 | |
| </p> | |
| </div> | |
| <div class="hidden md:block text-right"> | |
| <div class="text-xs text-gray-500 uppercase">Last Sync</div> | |
| <div class="text-sm font-mono text-gray-300" id="clock">00:00:00</div> | |
| </div> | |
| </header> | |
| <!-- Stats Row --> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8"> | |
| <!-- Stat Card 1 --> | |
| <div class="bg-void-800 border border-gray-800 rounded-lg p-5 shadow-lg relative overflow-hidden group hover:border-neon-green transition-colors"> | |
| <div class="absolute right-2 top-2 opacity-10 group-hover:opacity-20 transition-opacity"> | |
| <i data-feather="cpu" class="w-12 h-12 text-neon-green"></i> | |
| </div> | |
| <h3 class="text-gray-400 text-xs uppercase font-bold tracking-widest">Active Agents</h3> | |
| <div class="text-3xl font-bold text-white mt-2 font-mono">42</div> | |
| <div class="text-xs text-neon-green mt-1 flex items-center"> | |
| <i data-feather="arrow-up" class="w-3 h-3 mr-1"></i> 12% increase | |
| </div> | |
| </div> | |
| <!-- Stat Card 2 --> | |
| <div class="bg-void-800 border border-gray-800 rounded-lg p-5 shadow-lg relative overflow-hidden group hover:border-neon-orange transition-colors"> | |
| <div class="absolute right-2 top-2 opacity-10 group-hover:opacity-20 transition-opacity"> | |
| <i data-feather="activity" class="w-12 h-12 text-neon-orange"></i> | |
| </div> | |
| <h3 class="text-gray-400 text-xs uppercase font-bold tracking-widest">Pending Tasks</h3> | |
| <div class="text-3xl font-bold text-white mt-2 font-mono">08</div> | |
| <div class="text-xs text-neon-orange mt-1">Critical Queue</div> | |
| </div> | |
| <!-- Stat Card 3 --> | |
| <div class="bg-void-800 border border-gray-800 rounded-lg p-5 shadow-lg relative overflow-hidden group hover:border-neon-gold transition-colors"> | |
| <div class="absolute right-2 top-2 opacity-10 group-hover:opacity-20 transition-opacity"> | |
| <i data-feather="shield" class="w-12 h-12 text-neon-gold"></i> | |
| </div> | |
| <h3 class="text-gray-400 text-xs uppercase font-bold tracking-widest">Security Level</h3> | |
| <div class="text-3xl font-bold text-white mt-2 font-mono">HIGH</div> | |
| <div class="text-xs text-neon-gold mt-1">Encryption Active</div> | |
| </div> | |
| <!-- Stat Card 4 --> | |
| <div class="bg-void-800 border border-gray-800 rounded-lg p-5 shadow-lg relative overflow-hidden group hover:border-neon-red transition-colors"> | |
| <div class="absolute right-2 top-2 opacity-10 group-hover:opacity-20 transition-opacity"> | |
| <i data-feather="alert-triangle" class="w-12 h-12 text-neon-red"></i> | |
| </div> | |
| <h3 class="text-gray-400 text-xs uppercase font-bold tracking-widest">Threats Blocked</h3> | |
| <div class="text-3xl font-bold text-white mt-2 font-mono">1,024</div> | |
| <div class="text-xs text-neon-red mt-1">Last 24h</div> | |
| </div> | |
| </div> | |
| <!-- Extended Stats Row 2 --> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 gap-4 mb-8"> | |
| <custom-stat-card title="CPU Load" value="67%" color="green" icon="cpu" trend="+2%"></custom-stat-card> | |
| <custom-stat-card title="Memory" value="4.2 GB" color="orange" icon="hard-drive" trend="stable"></custom-stat-card> | |
| <custom-stat-card title="Network" value="1.2 GB/s" color="gold" icon="wifi" trend="-5%"></custom-stat-card> | |
| <custom-stat-card title="Uptime" value="47d 12h" color="green" icon="clock" trend="record"></custom-stat-card> | |
| <custom-stat-card title="Nodes" value="156" color="blue" icon="server" trend="+8"></custom-stat-card> | |
| </div> | |
| <!-- Stat Card 1 --> | |
| <div class="bg-void-800 border border-gray-800 rounded-lg p-5 shadow-lg relative overflow-hidden group hover:border-neon-green transition-colors"> | |
| <div class="absolute right-2 top-2 opacity-10 group-hover:opacity-20 transition-opacity"> | |
| <i data-feather="cpu" class="w-12 h-12 text-neon-green"></i> | |
| </div> | |
| <h3 class="text-gray-400 text-xs uppercase font-bold tracking-widest">Active Agents</h3> | |
| <div class="text-3xl font-bold text-white mt-2 font-mono">42</div> | |
| <div class="text-xs text-neon-green mt-1 flex items-center"> | |
| <i data-feather="arrow-up" class="w-3 h-3 mr-1"></i> 12% increase | |
| </div> | |
| </div> | |
| <!-- Stat Card 2 --> | |
| <div class="bg-void-800 border border-gray-800 rounded-lg p-5 shadow-lg relative overflow-hidden group hover:border-neon-orange transition-colors"> | |
| <div class="absolute right-2 top-2 opacity-10 group-hover:opacity-20 transition-opacity"> | |
| <i data-feather="activity" class="w-12 h-12 text-neon-orange"></i> | |
| </div> | |
| <h3 class="text-gray-400 text-xs uppercase font-bold tracking-widest">Pending Tasks</h3> | |
| <div class="text-3xl font-bold text-white mt-2 font-mono">08</div> | |
| <div class="text-xs text-neon-orange mt-1">Critical Queue</div> | |
| </div> | |
| <!-- Stat Card 3 --> | |
| <div class="bg-void-800 border border-gray-800 rounded-lg p-5 shadow-lg relative overflow-hidden group hover:border-neon-gold transition-colors"> | |
| <div class="absolute right-2 top-2 opacity-10 group-hover:opacity-20 transition-opacity"> | |
| <i data-feather="shield" class="w-12 h-12 text-neon-gold"></i> | |
| </div> | |
| <h3 class="text-gray-400 text-xs uppercase font-bold tracking-widest">Security Level</h3> | |
| <div class="text-3xl font-bold text-white mt-2 font-mono">HIGH</div> | |
| <div class="text-xs text-neon-gold mt-1">Encryption Active</div> | |
| </div> | |
| <!-- Stat Card 4 --> | |
| <div class="bg-void-800 border border-gray-800 rounded-lg p-5 shadow-lg relative overflow-hidden group hover:border-neon-red transition-colors"> | |
| <div class="absolute right-2 top-2 opacity-10 group-hover:opacity-20 transition-opacity"> | |
| <i data-feather="alert-triangle" class="w-12 h-12 text-neon-red"></i> | |
| </div> | |
| <h3 class="text-gray-400 text-xs uppercase font-bold tracking-widest">Threats Blocked</h3> | |
| <div class="text-3xl font-bold text-white mt-2 font-mono">1,024</div> | |
| <div class="text-xs text-neon-red mt-1">Last 24h</div> | |
| </div> | |
| </div> | |
| <div class="grid grid-cols-1 lg:grid-cols-3 gap-8 mb-8"> | |
| <!-- Operation Control Panel (Feature Request) --> | |
| <div class="lg:col-span-2 bg-void-800 border border-gray-700 rounded-xl shadow-2xl relative overflow-hidden"> | |
| <div class="absolute top-0 right-0 p-4 opacity-20"> | |
| <i data-feather="crosshair" class="w-24 h-24 text-gray-500"></i> | |
| </div> | |
| <div class="p-6 border-b border-gray-700 bg-gradient-to-r from-void-900 to-void-800"> | |
| <h2 class="text-xl font-bold text-white flex items-center gap-2"> | |
| <i data-feather="settings" class="text-neon-green"></i> | |
| Operation Control | |
| </h2> | |
| <p class="text-gray-400 text-sm mt-1">Manual override for attack simulation and fleet deployment.</p> | |
| </div> | |
| <div class="p-8"> | |
| <!-- Simulation Status --> | |
| <div class="flex justify-between items-center mb-8"> | |
| <div class="flex flex-col"> | |
| <span class="text-xs text-gray-500 uppercase tracking-wider mb-1">Current State</span> | |
| <span id="sim-status-text" class="text-2xl font-mono font-bold text-neon-green animate-pulse">IDLE</span> | |
| </div> | |
| <div class="text-right"> | |
| <span class="text-xs text-gray-500 uppercase tracking-wider mb-1 block">Runtime</span> | |
| <span id="sim-timer" class="text-2xl font-mono text-white">00:00:00</span> | |
| </div> | |
| </div> | |
| <!-- Progress Bar --> | |
| <div class="w-full bg-gray-900 rounded-full h-2.5 mb-8 border border-gray-700"> | |
| <div id="sim-progress" class="bg-gradient-to-r from-neon-green to-neon-gold h-2.5 rounded-full" style="width: 0%"></div> | |
| </div> | |
| <!-- Controls Grid --> | |
| <div class="grid grid-cols-1 sm:grid-cols-3 gap-4"> | |
| <button id="btn-advance" class="group relative px-6 py-4 bg-void-700 border border-neon-green/30 rounded-lg overflow-hidden hover:border-neon-green transition-all"> | |
| <div class="absolute inset-0 bg-neon-green/5 translate-y-full group-hover:translate-y-0 transition-transform"></div> | |
| <div class="flex flex-col items-center relative z-10"> | |
| <i data-feather="play" class="w-6 h-6 text-neon-green mb-2 fill-current"></i> | |
| <span class="text-sm font-bold text-gray-200 group-hover:text-white">ADVANCE</span> | |
| </div> | |
| </button> | |
| <button id="btn-pause" class="group relative px-6 py-4 bg-void-700 border border-neon-orange/30 rounded-lg overflow-hidden hover:border-neon-orange transition-all"> | |
| <div class="absolute inset-0 bg-neon-orange/5 translate-y-full group-hover:translate-y-0 transition-transform"></div> | |
| <div class="flex flex-col items-center relative z-10"> | |
| <i data-feather="pause" class="w-6 h-6 text-neon-orange mb-2 fill-current"></i> | |
| <span class="text-sm font-bold text-gray-200 group-hover:text-white">PAUSE</span> | |
| </div> | |
| </button> | |
| <button id="btn-reset" class="group relative px-6 py-4 bg-void-700 border border-neon-red/30 rounded-lg overflow-hidden hover:border-neon-red transition-all"> | |
| <div class="absolute inset-0 bg-neon-red/5 translate-y-full group-hover:translate-y-0 transition-transform"></div> | |
| <div class="flex flex-col items-center relative z-10"> | |
| <i data-feather="rotate-ccw" class="w-6 h-6 text-neon-red mb-2 fill-current"></i> | |
| <span class="text-sm font-bold text-gray-200 group-hover:text-white">RESET</span> | |
| </div> | |
| </button> | |
| </div> | |
| <div class="mt-6 text-center"> | |
| <p class="text-xs text-gray-600 font-mono">COMMAND AUTHORIZATION LEVEL 4 REQUIRED</p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- AI Companion (NLP Enabled) --> | |
| <div class="bg-void-800 border border-gray-700 rounded-xl flex flex-col h-[500px] lg:h-auto shadow-2xl relative overflow-hidden"> | |
| <div class="p-4 border-b border-gray-700 bg-void-900 flex justify-between items-center"> | |
| <h2 class="text-sm font-bold text-white flex items-center gap-2"> | |
| <i data-feather="cpu" class="text-neon-gold"></i> | |
| AI COMPANION | |
| </h2> | |
| <div class="flex gap-2"> | |
| <span id="nlp-status" class="text-[10px] bg-gray-800 px-2 py-0.5 rounded text-gray-400 border border-gray-600">VOICE OFF</span> | |
| </div> | |
| </div> | |
| <!-- Chat Area --> | |
| <div id="chat-history" class="flex-1 overflow-y-auto p-4 space-y-4 scroll-smooth"> | |
| <!-- AI Message --> | |
| <div class="flex items-start gap-3"> | |
| <div class="w-8 h-8 rounded bg-gradient-to-br from-gray-700 to-gray-900 flex items-center justify-center border border-gray-600"> | |
| <i data-feather="aperture" class="w-4 h-4 text-neon-gold"></i> | |
| </div> | |
| <div class="bg-void-700 p-3 rounded-lg rounded-tl-none text-sm text-gray-200 border border-gray-700 shadow-sm"> | |
| <p class="mb-1">Greetings, Commander. I am ready to assist.</p> | |
| <p class="text-xs text-gray-500 font-mono mt-1">SYS: NLP Module Active</p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Input Area --> | |
| <div class="p-4 bg-void-900 border-t border-gray-700"> | |
| <div class="relative"> | |
| <input type="text" id="ai-input" placeholder="Type or use voice command..." class="w-full bg-void-800 border border-gray-700 rounded-lg py-3 pl-4 pr-12 text-sm text-white focus:outline-none focus:border-neon-green transition-colors"> | |
| <button id="voice-btn" class="absolute right-2 top-2 p-1.5 rounded-md hover:bg-gray-700 text-gray-400 hover:text-white transition-colors"> | |
| <i data-feather="mic" class="w-4 h-4"></i> | |
| </button> | |
| </div> | |
| <div class="mt-2 flex gap-2 overflow-x-auto pb-1"> | |
| <button class="cmd-chip text-[10px] bg-gray-800 hover:bg-gray-700 border border-gray-700 px-2 py-1 rounded text-gray-300">Status Report</button> | |
| <button class="cmd-chip text-[10px] bg-gray-800 hover:bg-gray-700 border border-gray-700 px-2 py-1 rounded text-gray-300">Pause Sim</button> | |
| <button class="cmd-chip text-[10px] bg-gray-800 hover:bg-gray-700 border border-gray-700 px-2 py-1 rounded text-gray-300">Analyze</button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- System Health & Resource Monitoring --> | |
| <div class="grid grid-cols-1 lg:grid-cols-2 gap-8 mb-8"> | |
| <!-- Resource Usage Chart --> | |
| <div class="bg-void-800 border border-gray-800 rounded-xl shadow-lg"> | |
| <div class="p-4 border-b border-gray-700 flex justify-between items-center"> | |
| <h3 class="text-lg font-bold text-white">Resource Usage</h3> | |
| <div class="flex gap-2"> | |
| <span class="w-3 h-3 rounded-full bg-neon-green"></span> | |
| <span class="w-3 h-3 rounded-full bg-neon-orange"></span> | |
| <span class="w-3 h-3 rounded-full bg-neon-gold"></span> | |
| </div> | |
| </div> | |
| <div class="p-6"> | |
| <custom-chart type="line" data="65,72,68,75,80,78,82,85,79,73" labels="00,02,04,06,08,10,12,14,16,18"></custom-chart> | |
| </div> | |
| </div> | |
| <!-- Network Topology --> | |
| <div class="bg-void-800 border border-gray-800 rounded-xl shadow-lg"> | |
| <div class="p-4 border-b border-gray-700 flex justify-between items-center"> | |
| <h3 class="text-lg font-bold text-white">Network Topology</h3> | |
| <button class="text-xs bg-gray-700 hover:bg-gray-600 px-3 py-1 rounded text-gray-300 transition-colors">Refresh</button> | |
| </div> | |
| <div class="p-6 relative h-64" id="network-map"> | |
| <div class="absolute inset-0 flex items-center justify-center"> | |
| <div class="w-32 h-32 rounded-full border-2 border-neon-green/30 flex items-center justify-center animate-pulse"> | |
| <div class="w-20 h-20 rounded-full border border-neon-green/50 flex items-center justify-center"> | |
| <div class="w-12 h-12 rounded-full bg-neon-green/20 flex items-center justify-center"> | |
| <i data-feather="server" class="w-6 h-6 text-neon-green"></i> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Satellite nodes --> | |
| <div class="absolute top-4 left-1/4 w-8 h-8 rounded-full bg-neon-orange/20 border border-neon-orange flex items-center justify-center"> | |
| <i data-feather="box" class="w-4 h-4 text-neon-orange"></i> | |
| </div> | |
| <div class="absolute top-8 right-1/4 w-8 h-8 rounded-full bg-neon-gold/20 border border-neon-gold flex items-center justify-center"> | |
| <i data-feather="database" class="w-4 h-4 text-neon-gold"></i> | |
| </div> | |
| <div class="absolute bottom-8 left-1/3 w-8 h-8 rounded-full bg-blue-500/20 border border-blue-500 flex items-center justify-center"> | |
| <i data-feather="cloud" class="w-4 h-4 text-blue-500"></i> | |
| </div> | |
| <div class="absolute bottom-4 right-1/3 w-8 h-8 rounded-full bg-purple-500/20 border border-purple-500 flex items-center justify-center"> | |
| <i data-feather="lock" class="w-4 h-4 text-purple-500"></i> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Quick Actions Panel --> | |
| <div class="bg-void-800 border border-gray-800 rounded-xl shadow-lg mb-8"> | |
| <div class="p-4 border-b border-gray-700"> | |
| <h3 class="text-lg font-bold text-white">Quick Actions</h3> | |
| </div> | |
| <div class="p-6"> | |
| <div class="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-6 gap-4"> | |
| <button class="quick-action flex flex-col items-center gap-2 p-4 bg-void-700 rounded-lg border border-gray-700 hover:border-neon-green hover:bg-void-900 transition-all group"> | |
| <i data-feather="play-circle" class="w-8 h-8 text-neon-green group-hover:scale-110 transition-transform"></i> | |
| <span class="text-xs text-gray-400 group-hover:text-white">Deploy</span> | |
| </button> | |
| <button class="quick-action flex flex-col items-center gap-2 p-4 bg-void-700 rounded-lg border border-gray-700 hover:border-neon-orange hover:bg-void-900 transition-all group"> | |
| <i data-feather="refresh-cw" class="w-8 h-8 text-neon-orange group-hover:scale-110 transition-transform"></i> | |
| <span class="text-xs text-gray-400 group-hover:text-white">Sync</span> | |
| </button> | |
| <button class="quick-action flex flex-col items-center gap-2 p-4 bg-void-700 rounded-lg border border-gray-700 hover:border-neon-gold hover:bg-void-900 transition-all group"> | |
| <i data-feather="download" class="w-8 h-8 text-neon-gold group-hover:scale-110 transition-transform"></i> | |
| <span class="text-xs text-gray-400 group-hover:text-white">Export</span> | |
| </button> | |
| <button class="quick-action flex flex-col items-center gap-2 p-4 bg-void-700 rounded-lg border border-gray-700 hover:border-blue-500 hover:bg-void-900 transition-all group"> | |
| <i data-feather="upload" class="w-8 h-8 text-blue-500 group-hover:scale-110 transition-transform"></i> | |
| <span class="text-xs text-gray-400 group-hover:text-white">Import</span> | |
| </button> | |
| <button class="quick-action flex flex-col items-center gap-2 p-4 bg-void-700 rounded-lg border border-gray-700 hover:border-purple-500 hover:bg-void-900 transition-all group"> | |
| <i data-feather="search" class="w-8 h-8 text-purple-500 group-hover:scale-110 transition-transform"></i> | |
| <span class="text-xs text-gray-400 group-hover:text-white">Analyze</span> | |
| </button> | |
| <button class="quick-action flex flex-col items-center gap-2 p-4 bg-void-700 rounded-lg border border-gray-700 hover:border-neon-red hover:bg-void-900 transition-all group"> | |
| <i data-feather="power" class="w-8 h-8 text-neon-red group-hover:scale-110 transition-transform"></i> | |
| <span class="text-xs text-gray-400 group-hover:text-white">Shutdown</span> | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Terminal Output Panel --> | |
| <div class="bg-void-800 border border-gray-800 rounded-xl shadow-lg mb-8"> | |
| <div class="p-4 border-b border-gray-700 flex justify-between items-center"> | |
| <h3 class="text-lg font-bold text-white flex items-center gap-2"> | |
| <i data-feather="terminal" class="text-neon-green"></i> | |
| System Terminal | |
| </h3> | |
| <div class="flex gap-2"> | |
| <button id="clear-terminal" class="text-xs bg-gray-700 hover:bg-gray-600 px-3 py-1 rounded text-gray-300 transition-colors">Clear</button> | |
| <button class="text-xs bg-neon-green/10 hover:bg-neon-green/20 text-neon-green border border-neon-green/30 px-3 py-1 rounded transition-colors">Expand</button> | |
| </div> | |
| </div> | |
| <div id="terminal-output" class="p-4 h-48 overflow-y-auto font-mono text-sm space-y-1 bg-void-900"> | |
| <div class="text-gray-500">[SYSTEM] Initializing Clawdbot C2 v3.2.0...</div> | |
| <div class="text-neon-green">[OK] Core modules loaded</div> | |
| <div class="text-neon-green">[OK] Network interface active</div> | |
| <div class="text-neon-green">[OK] Security protocols engaged</div> | |
| <div class="text-gray-500">[INFO] 42 agents connected</div> | |
| <div class="text-neon-orange">[WARN] High memory usage on Node-07</div> | |
| <div class="text-gray-500">[SYSTEM] Ready for commands</div> | |
| </div> | |
| <div class="p-3 border-t border-gray-700 bg-void-900"> | |
| <div class="flex items-center gap-2"> | |
| <span class="text-neon-green font-mono">$</span> | |
| <input type="text" id="terminal-input" placeholder="Enter command..." class="flex-1 bg-transparent border-none outline-none text-white font-mono text-sm"> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Recent Activity Table --> | |
| <div class="mt-8 bg-void-800 border border-gray-800 rounded-xl overflow-hidden shadow-lg"> | |
| <div class="px-6 py-4 border-b border-gray-700 flex justify-between items-center"> | |
| <h3 class="text-lg font-bold text-white">Agent Fleet</h3> | |
| <button class="text-xs bg-neon-green/10 text-neon-green border border-neon-green/30 px-3 py-1 rounded hover:bg-neon-green/20 transition-colors flex items-center gap-1"> | |
| <i data-feather="plus" class="w-3 h-3"></i> Deploy New | |
| </button> | |
| </div> | |
| <div class="overflow-x-auto"> | |
| <table class="w-full text-left border-collapse"> | |
| <thead> | |
| <tr class="text-xs text-gray-500 uppercase bg-void-900 border-b border-gray-800"> | |
| <th class="px-6 py-3 font-medium">Agent ID</th> | |
| <th class="px-6 py-3 font-medium">Status</th> | |
| <th class="px-6 py-3 font-medium">Location</th> | |
| <th class="px-6 py-3 font-medium">Latency</th> | |
| <th class="px-6 py-3 font-medium text-right">Action</th> | |
| </tr> | |
| </thead> | |
| <tbody class="text-sm divide-y divide-gray-800"> | |
| <tr class="group hover:bg-white/5 transition-colors"> | |
| <td class="px-6 py-4 font-mono text-neon-green">AGNT-099</td> | |
| <td class="px-6 py-4"><span class="px-2 py-1 rounded text-[10px] bg-neon-green/10 text-neon-green border border-neon-green/20">ONLINE</span></td> | |
| <td class="px-6 py-4 text-gray-400">US-East-1</td> | |
| <td class="px-6 py-4 text-gray-400 font-mono">24ms</td> | |
| <td class="px-6 py-4 text-right"> | |
| <a href="#" class="text-gray-500 hover:text-white"><i data-feather="more-horizontal" class="w-4 h-4"></i></a> | |
| </td> | |
| </tr> | |
| <tr class="group hover:bg-white/5 transition-colors"> | |
| <td class="px-6 py-4 font-mono text-neon-orange">AGNT-104</td> | |
| <td class="px-6 py-4"><span class="px-2 py-1 rounded text-[10px] bg-neon-orange/10 text-neon-orange border border-neon-orange/20">BUSY</span></td> | |
| <td class="px-6 py-4 text-gray-400">EU-West-2</td> | |
| <td class="px-6 py-4 text-gray-400 font-mono">112ms</td> | |
| <td class="px-6 py-4 text-right"> | |
| <a href="#" class="text-gray-500 hover:text-white"><i data-feather="more-horizontal" class="w-4 h-4"></i></a> | |
| </td> | |
| </tr> | |
| <tr class="group hover:bg-white/5 transition-colors"> | |
| <td class="px-6 py-4 font-mono text-gray-500">AGNT-112</td> | |
| <td class="px-6 py-4"><span class="px-2 py-1 rounded text-[10px] bg-gray-700/30 text-gray-400 border border-gray-600">OFFLINE</span></td> | |
| <td class="px-6 py-4 text-gray-400">Asia-Pac-3</td> | |
| <td class="px-6 py-4 text-gray-400 font-mono">--</td> | |
| <td class="px-6 py-4 text-right"> | |
| <a href="#" class="text-gray-500 hover:text-white"><i data-feather="more-horizontal" class="w-4 h-4"></i></a> | |
| </td> | |
| </tr> | |
| </tbody> | |
| </table> | |
| </div> | |
| </div> | |
| </main> | |
| </div> | |
| <!-- Notification Toast Container --> | |
| <div id="toast-container" class="fixed bottom-4 right-4 z-50 space-y-2"></div> | |
| <!-- Modal Container --> | |
| <div id="modal-container"></div> | |
| <!-- Script Includes --> | |
| <script src="components/navbar.js"></script> | |
| <script src="components/sidebar.js"></script> | |
| <script src="components/stat-card.js"></script> | |
| <script src="components/chart.js"></script> | |
| <script src="components/terminal.js"></script> | |
| <script src="script.js"></script> | |
| <script> | |
| feather.replace(); | |
| </script> | |
| <script src="https://huggingface.co/deepsite/deepsite-badge.js"></script> | |
| </body> | |
| </html> |