mirror of
https://github.com/arkorty/B.Tech-Project-III.git
synced 2026-04-19 12:41:48 +00:00
348 lines
18 KiB
HTML
348 lines
18 KiB
HTML
<!DOCTYPE html>
|
|
|
|
<html class="dark" lang="en"><head>
|
|
<meta charset="utf-8"/>
|
|
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
|
|
<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
|
|
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Inter:wght@400;500;600&family=Space+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet"/>
|
|
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet"/>
|
|
<style>
|
|
body {
|
|
background-color: #09090B;
|
|
font-family: 'Poppins', sans-serif;
|
|
color: #f9f5f8;
|
|
margin: 0;
|
|
overflow-x: hidden;
|
|
}
|
|
.font-mono-data {
|
|
font-family: 'JetBrains Mono', monospace;
|
|
}
|
|
/* Updated Glass Card Style based on IMAGE_8 */
|
|
.glass-card {
|
|
background: linear-gradient(180deg, rgba(28, 20, 45, 0.7) 0%, rgba(18, 14, 28, 0.9) 100%);
|
|
backdrop-filter: blur(12px);
|
|
border: 1px solid rgba(167, 139, 250, 0.12);
|
|
position: relative;
|
|
overflow: hidden;
|
|
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
|
}
|
|
.glass-card::before {
|
|
content: '';
|
|
position: absolute;
|
|
left: 0;
|
|
top: 20%;
|
|
height: 60%;
|
|
width: 2px;
|
|
background: linear-gradient(to bottom, transparent, #A78BFA, transparent);
|
|
opacity: 0.4;
|
|
}
|
|
.glass-card:hover {
|
|
border-color: rgba(167, 139, 250, 0.3);
|
|
box-shadow: 0 0 30px rgba(167, 139, 250, 0.1);
|
|
}
|
|
.neon-glow-violet {
|
|
box-shadow: 0 0 20px rgba(167, 139, 250, 0.15);
|
|
}
|
|
.active-pulse {
|
|
box-shadow: 0 0 15px rgba(167, 139, 250, 0.4);
|
|
animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
|
|
}
|
|
@keyframes pulse {
|
|
0%, 100% { opacity: 1; transform: scale(1); }
|
|
50% { opacity: .7; transform: scale(1.1); }
|
|
}
|
|
.material-symbols-outlined {
|
|
font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24;
|
|
}
|
|
::-webkit-scrollbar {
|
|
width: 4px;
|
|
}
|
|
::-webkit-scrollbar-track {
|
|
background: #0e0e10;
|
|
}
|
|
::-webkit-scrollbar-thumb {
|
|
background: rgba(167, 139, 250, 0.3);
|
|
border-radius: 10px;
|
|
}
|
|
</style>
|
|
<script id="tailwind-config">
|
|
tailwind.config = {
|
|
darkMode: "class",
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
"primary": "#b79fff",
|
|
"surface": "#0e0e10",
|
|
"surface-container": "#19191c",
|
|
"surface-container-low": "#131315",
|
|
"surface-container-high": "#1f1f22",
|
|
"on-surface": "#f9f5f8",
|
|
"on-surface-variant": "#adaaad",
|
|
"outline-variant": "#48474a",
|
|
},
|
|
fontFamily: {
|
|
"headline": ["Poppins"],
|
|
"body": ["Poppins"],
|
|
"label": ["JetBrains Mono"]
|
|
},
|
|
borderRadius: {"DEFAULT": "0.125rem", "lg": "0.25rem", "xl": "0.5rem", "full": "0.75rem"},
|
|
},
|
|
},
|
|
}
|
|
</script>
|
|
</head>
|
|
<body class="bg-[#09090B] text-on-surface antialiased">
|
|
<!-- TopAppBar -->
|
|
<header class="fixed top-0 w-full z-50 bg-[#131315]/40 backdrop-blur-2xl shadow-[0_64px_64px_-12px_rgba(167,139,250,0.06)]">
|
|
<div class="flex items-center justify-between px-8 h-16 w-full">
|
|
<div class="text-xl font-bold tracking-tighter text-[#A78BFA] font-['Plus_Jakarta_Sans'] uppercase">
|
|
ThirdEye
|
|
</div>
|
|
<div class="hidden md:flex items-center space-x-8">
|
|
<nav class="flex items-center space-x-6 text-sm font-medium">
|
|
<a class="text-[#f9f5f8]/60 hover:text-[#A78BFA] transition-all duration-400 ease-[cubic-bezier(0.2,0,0,1)] uppercase" href="#">Signals</a>
|
|
<a class="text-[#A78BFA] font-semibold transition-all duration-400 uppercase" href="#">Intelligence</a>
|
|
<a class="text-[#f9f5f8]/60 hover:text-[#A78BFA] transition-all duration-400 ease-[cubic-bezier(0.2,0,0,1)] uppercase" href="#">Knowledge Graph</a>
|
|
</nav>
|
|
<div class="flex items-center space-x-4">
|
|
<span class="material-symbols-outlined text-[#f9f5f8]/60 cursor-pointer hover:text-[#A78BFA]" data-icon="settings">settings</span>
|
|
<span class="material-symbols-outlined text-[#f9f5f8]/60 cursor-pointer hover:text-[#A78BFA]" data-icon="account_circle">account_circle</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
<!-- SideNavBar -->
|
|
<aside class="fixed left-0 top-0 h-full w-64 z-40 bg-[#0e0e10] border-r border-[#A78BFA]/10 flex flex-col pt-20 pb-8 px-4 hidden lg:flex">
|
|
<div class="mb-8 px-4">
|
|
<div class="text-[#A78BFA] font-black text-xs tracking-[0.2em] mb-1">FLEET_OPS</div>
|
|
<div class="text-[10px] text-[#f9f5f8]/40 uppercase tracking-widest font-['Plus_Jakarta_Sans']">NEURAL_NET_STABLE</div>
|
|
</div>
|
|
<nav class="flex-1 space-y-1">
|
|
<div class="flex items-center px-4 py-3 text-[#f9f5f8]/40 hover:bg-[#131315] hover:text-[#f9f5f8] transition-all duration-400 cursor-pointer group">
|
|
<span class="material-symbols-outlined mr-3 text-sm" data-icon="hub">hub</span>
|
|
<span class="font-['Plus_Jakarta_Sans'] uppercase tracking-[0.1em] text-[10px]">Knowledge Graph</span>
|
|
</div>
|
|
<div class="flex items-center px-4 py-3 bg-[#A78BFA]/10 text-[#A78BFA] border-r-2 border-[#A78BFA] transition-all duration-400 cursor-pointer">
|
|
<span class="material-symbols-outlined mr-3 text-sm" data-icon="psychology">psychology</span>
|
|
<span class="font-['Plus_Jakarta_Sans'] uppercase tracking-[0.1em] text-[10px]">Intelligence</span>
|
|
</div>
|
|
<div class="flex items-center px-4 py-3 text-[#f9f5f8]/40 hover:bg-[#131315] hover:text-[#f9f5f8] transition-all duration-400 cursor-pointer group">
|
|
<span class="material-symbols-outlined mr-3 text-sm" data-icon="analytics">analytics</span>
|
|
<span class="font-['Plus_Jakarta_Sans'] uppercase tracking-[0.1em] text-[10px]">Signals</span>
|
|
</div>
|
|
<div class="flex items-center px-4 py-3 text-[#f9f5f8]/40 hover:bg-[#131315] hover:text-[#f9f5f8] transition-all duration-400 cursor-pointer group">
|
|
<span class="material-symbols-outlined mr-3 text-sm" data-icon="terminal">terminal</span>
|
|
<span class="font-['Plus_Jakarta_Sans'] uppercase tracking-[0.1em] text-[10px]">Thought Streams</span>
|
|
</div>
|
|
<div class="flex items-center px-4 py-3 text-[#f9f5f8]/40 hover:bg-[#131315] hover:text-[#f9f5f8] transition-all duration-400 cursor-pointer group">
|
|
<span class="material-symbols-outlined mr-3 text-sm" data-icon="inventory_2">inventory_2</span>
|
|
<span class="font-['Plus_Jakarta_Sans'] uppercase tracking-[0.1em] text-[10px]">Archive</span>
|
|
</div>
|
|
</nav>
|
|
<div class="mt-auto px-4">
|
|
<button class="w-full py-3 rounded-xl bg-[#b79fff] text-[#000000] text-[10px] font-bold tracking-[0.2em] uppercase active:scale-95 transition-transform">
|
|
SYNTHESIZE_INSIGHTS
|
|
</button>
|
|
</div>
|
|
</aside>
|
|
<!-- Main Content -->
|
|
<main class="lg:ml-64 pt-24 px-8 pb-12 min-h-screen">
|
|
<!-- Header Section -->
|
|
<header class="mb-12">
|
|
<div class="flex items-end justify-between">
|
|
<div>
|
|
<h1 class="text-4xl font-bold tracking-tight text-on-surface font-['Poppins']">Intelligence Control</h1>
|
|
<p class="text-[#A78BFA] font-mono-data text-xs mt-2 tracking-widest uppercase">ACTIVE_INSIGHTS: 1,422 // PROCESSING_VOLUME: 48.2 GB/HR</p>
|
|
</div>
|
|
<div class="flex items-center space-x-4">
|
|
<div class="px-4 py-2 bg-[#131315] rounded-xl flex items-center space-x-3">
|
|
<span class="w-2 h-2 rounded-full bg-[#A78BFA] active-pulse"></span>
|
|
<span class="text-[10px] font-mono-data text-[#f9f5f8]/60 uppercase">Inference Engine: Optimal</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
<!-- Signal Card Grid -->
|
|
<div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-6">
|
|
<!-- Semantic Processor Card -->
|
|
<div class="glass-card flex flex-col h-full rounded-2xl">
|
|
<!-- Card Header -->
|
|
<div class="px-6 pt-6 pb-4 flex justify-between items-start">
|
|
<div class="bg-[#A78BFA]/10 p-2.5 rounded-xl border border-[#A78BFA]/20">
|
|
<span class="material-symbols-outlined text-[#A78BFA]" data-icon="subject">subject</span>
|
|
</div>
|
|
<span class="text-[10px] font-mono-data text-[#f9f5f8]/40 uppercase tracking-widest">T-2M AGO</span>
|
|
</div>
|
|
<!-- Card Body -->
|
|
<div class="px-6 flex-1">
|
|
<h3 class="text-lg font-bold tracking-tight text-on-surface mb-2 uppercase">SEMANTIC_PROCESSOR</h3>
|
|
<p class="text-sm text-[#f9f5f8]/70 leading-relaxed mb-6">Processing deep contextual inference for all active data streams. High semantic alignment detected across node clusters.</p>
|
|
<div class="space-y-4 mb-6">
|
|
<div class="flex flex-col">
|
|
<div class="flex justify-between items-end mb-1.5">
|
|
<span class="text-[10px] uppercase text-[#f9f5f8]/40 tracking-widest">Context Depth</span>
|
|
<span class="text-[10px] font-mono-data text-[#A78BFA]">88%</span>
|
|
</div>
|
|
<div class="w-full h-1 bg-white/5 rounded-full overflow-hidden">
|
|
<div class="bg-gradient-to-r from-[#A78BFA] to-[#b79fff] h-full w-[88%]"></div>
|
|
</div>
|
|
</div>
|
|
<div class="flex justify-between items-center py-2 border-b border-white/5">
|
|
<span class="text-[10px] uppercase text-[#f9f5f8]/40">Confidence</span>
|
|
<span class="text-xs font-mono-data text-on-surface">99.4%</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Card Footer -->
|
|
<div class="px-6 py-4 border-t border-white/5 flex justify-between items-center group/footer cursor-pointer">
|
|
<span class="text-[10px] font-bold text-[#A78BFA] uppercase tracking-[0.2em] group-hover/footer:translate-x-1 transition-transform">Inference Details</span>
|
|
<span class="material-symbols-outlined text-sm text-[#A78BFA] group-hover/footer:translate-x-1 transition-transform" data-icon="arrow_forward">arrow_forward</span>
|
|
</div>
|
|
</div>
|
|
<!-- Sentiment Miner Card -->
|
|
<div class="glass-card flex flex-col h-full rounded-2xl">
|
|
<!-- Card Header -->
|
|
<div class="px-6 pt-6 pb-4 flex justify-between items-start">
|
|
<div class="bg-[#A78BFA]/10 p-2.5 rounded-xl border border-[#A78BFA]/20">
|
|
<span class="material-symbols-outlined text-[#A78BFA] active-pulse" data-icon="mood">mood</span>
|
|
</div>
|
|
<span class="text-[10px] font-mono-data text-[#f9f5f8]/40 uppercase tracking-widest">T-14M AGO</span>
|
|
</div>
|
|
<!-- Card Body -->
|
|
<div class="px-6 flex-1">
|
|
<h3 class="text-lg font-bold tracking-tight text-on-surface mb-2 uppercase">SENTIMENT_MINER</h3>
|
|
<p class="text-sm text-[#f9f5f8]/70 leading-relaxed mb-6">Identifying emotional flux patterns within the engineering-ops communications. Analyzing 1.2k buffered signals.</p>
|
|
<div class="p-4 bg-[#A78BFA]/5 rounded-xl border border-[#A78BFA]/10 mb-6">
|
|
<div class="text-[10px] uppercase text-[#A78BFA] mb-1 font-bold">Recommended Action</div>
|
|
<p class="text-[11px] text-[#f9f5f8]/80 leading-relaxed">Adjust active pattern to EMOTIONAL_FLUX_v5 for improved recognition.</p>
|
|
</div>
|
|
</div>
|
|
<!-- Card Footer -->
|
|
<div class="px-6 py-4 border-t border-white/5 flex justify-between items-center group/footer cursor-pointer">
|
|
<span class="text-[10px] font-bold text-[#A78BFA] uppercase tracking-[0.2em] group-hover/footer:translate-x-1 transition-transform">Refine Analysis</span>
|
|
<span class="material-symbols-outlined text-sm text-[#A78BFA] group-hover/footer:translate-x-1 transition-transform" data-icon="arrow_forward">arrow_forward</span>
|
|
</div>
|
|
</div>
|
|
<!-- Context Weaver Card -->
|
|
<div class="glass-card flex flex-col h-full rounded-2xl">
|
|
<!-- Card Header -->
|
|
<div class="px-6 pt-6 pb-4 flex justify-between items-start">
|
|
<div class="bg-[#f9f5f8]/5 p-2.5 rounded-xl border border-white/10">
|
|
<span class="material-symbols-outlined text-[#f9f5f8]/40" data-icon="schema">schema</span>
|
|
</div>
|
|
<span class="text-[10px] font-mono-data text-[#f9f5f8]/40 uppercase tracking-widest">T-1H AGO</span>
|
|
</div>
|
|
<!-- Card Body -->
|
|
<div class="px-6 flex-1">
|
|
<h3 class="text-lg font-bold tracking-tight text-on-surface mb-2 uppercase">CONTEXT_WEAVER</h3>
|
|
<p class="text-sm text-[#f9f5f8]/70 leading-relaxed mb-6">Mapping complex node relationships across the knowledge mesh. Current density remains stable at 4.8m nodes.</p>
|
|
<div class="space-y-4 mb-6">
|
|
<div class="flex justify-between items-center py-2 border-b border-white/5">
|
|
<span class="text-[10px] uppercase text-[#f9f5f8]/40">Last Convergence</span>
|
|
<span class="text-xs font-mono-data text-on-surface">42s ago</span>
|
|
</div>
|
|
<div class="flex justify-between items-center py-2 border-b border-white/5">
|
|
<span class="text-[10px] uppercase text-[#f9f5f8]/40">Memory Buffer</span>
|
|
<span class="text-xs font-mono-data text-[#A78BFA]">MAXIMUM_CAPACITY</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Card Footer -->
|
|
<div class="px-6 py-4 border-t border-white/5 flex justify-between items-center group/footer cursor-pointer">
|
|
<span class="text-[10px] font-bold text-[#f9f5f8]/40 uppercase tracking-[0.2em]">System Initializing</span>
|
|
<span class="material-symbols-outlined text-sm text-[#f9f5f8]/40" data-icon="lock">lock</span>
|
|
</div>
|
|
</div>
|
|
<!-- Knowledge Graph Visualizer -->
|
|
<div class="xl:col-span-2 glass-card p-6 rounded-2xl relative overflow-hidden">
|
|
<div class="flex justify-between items-center mb-6">
|
|
<div>
|
|
<h3 class="text-sm font-bold tracking-tight text-on-surface uppercase">Global Knowledge Mesh</h3>
|
|
<p class="text-[10px] font-mono-data text-[#f9f5f8]/40 mt-1 uppercase">Cross-Source Entity Integration / Real-time Feed</p>
|
|
</div>
|
|
<div class="flex space-x-2">
|
|
<span class="px-2 py-1 bg-[#131315] rounded border border-[#A78BFA]/20 text-[10px] font-mono-data text-[#A78BFA]">KNOWLEDGE_GRAPH</span>
|
|
</div>
|
|
</div>
|
|
<div class="h-64 w-full bg-[#000000]/30 rounded-xl flex items-center justify-center relative overflow-hidden border border-white/5">
|
|
<div class="absolute inset-0 opacity-20 pointer-events-none">
|
|
<div class="absolute inset-0" style="background-image: radial-gradient(circle at 2px 2px, #A78BFA 1px, transparent 0); background-size: 24px 24px;"></div>
|
|
</div>
|
|
<img alt="Organizational knowledge graph nodes" class="w-full h-full object-cover opacity-10" data-alt="Abstract network of intelligence nodes and connections" src="https://lh3.googleusercontent.com/aida-public/AB6AXuCyYE6n8fj-pN_tJtHJliVGGQkx5UqtoEC8vBsUtkO9p4SSDuGRQ8__KnwFtpfuo8xual4G_X-2XEmtXKoVhHHufT4Vc2kml0JyrqE7VlM40JmfMi808_47Eox88vAZyIeEV-tB6IYk_Mj7Ff_vwaXEKfvAa-Y4CEX-JXcGvmvWx0XYFvl7mm0CuqsocghCsNfNjWGsmxq3XBcx8dO1JhsVM4TjgNzwgijiL7qM8oDsKMjwUWy8g-LpzUb5rVIp7WXRF2GYR9Hfx9xN"/>
|
|
<div class="absolute inset-0 flex items-center justify-center">
|
|
<div class="relative">
|
|
<div class="w-4 h-4 bg-[#A78BFA] rounded-full active-pulse"></div>
|
|
<div class="absolute top-6 -left-12 bg-[#131315]/80 backdrop-blur-md border border-[#A78BFA]/20 px-3 py-1 rounded text-[10px] font-mono-data text-white">ENTITY_CLUSTER_09</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Activity Log Card -->
|
|
<div class="glass-card p-6 rounded-2xl flex flex-col">
|
|
<h3 class="text-sm font-bold tracking-tight text-on-surface uppercase mb-6">Thought Streams</h3>
|
|
<div class="space-y-4 flex-1 overflow-y-auto max-h-[16rem] pr-2">
|
|
<div class="flex items-start space-x-3 text-[10px]">
|
|
<span class="font-mono-data text-[#A78BFA] shrink-0">14:22:02</span>
|
|
<p class="text-[#f9f5f8]/60 leading-relaxed font-mono-data"><span class="text-[#A78BFA]">PROCESS:</span> Mapping cross-team dependencies in Project_Orion.</p>
|
|
</div>
|
|
<div class="flex items-start space-x-3 text-[10px]">
|
|
<span class="font-mono-data text-[#A78BFA] shrink-0">14:21:58</span>
|
|
<p class="text-[#f9f5f8]/60 leading-relaxed font-mono-data"><span class="text-[#A78BFA]">SIGNAL:</span> Detecting emerging sentiment trends in #engineering-ops.</p>
|
|
</div>
|
|
<div class="flex items-start space-x-3 text-[10px]">
|
|
<span class="font-mono-data text-[#A78BFA] shrink-0">14:21:10</span>
|
|
<p class="text-[#f9f5f8]/60 leading-relaxed font-mono-data"><span class="text-on-surface">INSIGHT:</span> Synthesizing organizational knowledge on 'Hybrid_Workflow_v2'.</p>
|
|
</div>
|
|
<div class="flex items-start space-x-3 text-[10px]">
|
|
<span class="font-mono-data text-[#A78BFA] shrink-0">14:19:01</span>
|
|
<p class="text-[#f9f5f8]/60 leading-relaxed font-mono-data"><span class="text-[#A78BFA]">PROCESS:</span> Linked 'Q3_Roadmap' to 14 separate conversation threads.</p>
|
|
</div>
|
|
<div class="flex items-start space-x-3 text-[10px]">
|
|
<span class="font-mono-data text-[#A78BFA] shrink-0">14:18:45</span>
|
|
<p class="text-[#f9f5f8]/60 leading-relaxed font-mono-data"><span class="text-[#A78BFA]">PROCESS:</span> Re-indexing entity 'Leadership_Summit' with high urgency flag.</p>
|
|
</div>
|
|
</div>
|
|
<button class="mt-6 w-full py-3 bg-[#A78BFA]/5 border border-[#A78BFA]/20 rounded-xl text-[#A78BFA] text-[10px] font-mono-data uppercase tracking-widest hover:bg-[#A78BFA]/10 transition-all">Export Intelligence Data</button>
|
|
</div>
|
|
</div>
|
|
<!-- System Footer Stats -->
|
|
<footer class="mt-20 border-t border-[#A78BFA]/10 pt-8 flex flex-wrap justify-between items-center gap-8">
|
|
<div class="flex items-center space-x-12">
|
|
<div>
|
|
<div class="text-[10px] font-mono-data text-[#f9f5f8]/40 uppercase tracking-widest mb-1">Inference Latency</div>
|
|
<div class="text-lg font-bold text-on-surface font-mono-data">14 MS</div>
|
|
</div>
|
|
<div>
|
|
<div class="text-[10px] font-mono-data text-[#f9f5f8]/40 uppercase tracking-widest mb-1">Neural Encryption</div>
|
|
<div class="text-lg font-bold text-on-surface font-mono-data">THIRDEYE-X9</div>
|
|
</div>
|
|
<div>
|
|
<div class="text-[10px] font-mono-data text-[#f9f5f8]/40 uppercase tracking-widest mb-1">Active Connectors</div>
|
|
<div class="text-lg font-bold text-on-surface font-mono-data">14 / 16</div>
|
|
</div>
|
|
</div>
|
|
<div class="text-[10px] font-mono-data text-[#A78BFA]/60 tracking-tighter">
|
|
© 2024 THIRDEYE_INTELLIGENCE // PRIVACY_FIRST_MONITORING
|
|
</div>
|
|
</footer>
|
|
</main>
|
|
<!-- Mobile Bottom Navigation -->
|
|
<nav class="fixed bottom-0 left-0 right-0 bg-[#131315]/80 backdrop-blur-xl md:hidden z-50 flex justify-around items-center h-16 border-t border-[#A78BFA]/10">
|
|
<div class="flex flex-col items-center text-[#f9f5f8]/40">
|
|
<span class="material-symbols-outlined text-xl" data-icon="hub">hub</span>
|
|
<span class="text-[8px] uppercase mt-1">Graph</span>
|
|
</div>
|
|
<div class="flex flex-col items-center text-[#A78BFA]">
|
|
<span class="material-symbols-outlined text-xl" data-icon="psychology">psychology</span>
|
|
<span class="text-[8px] uppercase mt-1">Intel</span>
|
|
</div>
|
|
<div class="flex flex-col items-center text-[#f9f5f8]/40">
|
|
<span class="material-symbols-outlined text-xl" data-icon="analytics">analytics</span>
|
|
<span class="text-[8px] uppercase mt-1">Signals</span>
|
|
</div>
|
|
<div class="flex flex-col items-center text-[#f9f5f8]/40">
|
|
<span class="material-symbols-outlined text-xl" data-icon="account_circle">account_circle</span>
|
|
<span class="text-[8px] uppercase mt-1">User</span>
|
|
</div>
|
|
</nav>
|
|
</body></html> |