Update dashboard styles and branding to reflect HexaHost theme. Change primary colors, background gradients, and text styles across various components. Enhance layout and navigation elements for improved user experience.
BIN
bot/assets/logo.png
Normal file
|
After Width: | Height: | Size: 9.8 KiB |
42
bot/assets/logo.svg
Normal file
@@ -0,0 +1,42 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128" role="img" aria-label="Axiom">
|
||||||
|
<defs>
|
||||||
|
<linearGradient id="axiomGrad" x1="0%" y1="0%" x2="100%" y2="100%">
|
||||||
|
<stop offset="0%" stop-color="#ff51f9"/>
|
||||||
|
<stop offset="55%" stop-color="#a348ff"/>
|
||||||
|
<stop offset="100%" stop-color="#3978ff"/>
|
||||||
|
</linearGradient>
|
||||||
|
<linearGradient id="axiomSheen" x1="0%" y1="0%" x2="0%" y2="100%">
|
||||||
|
<stop offset="0%" stop-color="#ffffff" stop-opacity="0.22"/>
|
||||||
|
<stop offset="45%" stop-color="#ffffff" stop-opacity="0"/>
|
||||||
|
</linearGradient>
|
||||||
|
<filter id="softGlow" x="-20%" y="-20%" width="140%" height="140%">
|
||||||
|
<feGaussianBlur stdDeviation="2.5" result="blur"/>
|
||||||
|
<feMerge>
|
||||||
|
<feMergeNode in="blur"/>
|
||||||
|
<feMergeNode in="SourceGraphic"/>
|
||||||
|
</feMerge>
|
||||||
|
</filter>
|
||||||
|
</defs>
|
||||||
|
|
||||||
|
<!-- Hexagon HexaHost DNA -->
|
||||||
|
<polygon
|
||||||
|
points="64,8 112,36 112,92 64,120 16,92 16,36"
|
||||||
|
fill="url(#axiomGrad)"
|
||||||
|
stroke="#00cfff"
|
||||||
|
stroke-width="2.5"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
filter="url(#softGlow)"
|
||||||
|
/>
|
||||||
|
<polygon
|
||||||
|
points="64,8 112,36 112,92 64,120 16,92 16,36"
|
||||||
|
fill="url(#axiomSheen)"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!-- Stylized A for Axiom -->
|
||||||
|
<path
|
||||||
|
d="M64 34 L88 94 H77.2 L71.4 78 H56.6 L50.8 94 H40 Z M59.2 70 H68.8 L64 56 Z"
|
||||||
|
fill="#ffffff"
|
||||||
|
/>
|
||||||
|
<!-- Crossbar accent in neon -->
|
||||||
|
<rect x="54" y="68" width="20" height="4.5" rx="1.5" fill="#00cfff"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.4 KiB |
@@ -26,6 +26,7 @@ import { useSession, signIn, signOut } from "next-auth/react";
|
|||||||
import { cn, isAdmin } from "@/lib/utils";
|
import { cn, isAdmin } from "@/lib/utils";
|
||||||
import { api } from "@/lib/api";
|
import { api } from "@/lib/api";
|
||||||
import { AdminConfig } from "@/types/api";
|
import { AdminConfig } from "@/types/api";
|
||||||
|
import { BrandLogo } from "@/components/brand-logo";
|
||||||
|
|
||||||
export default function DashboardLayout({
|
export default function DashboardLayout({
|
||||||
children,
|
children,
|
||||||
@@ -83,11 +84,9 @@ export default function DashboardLayout({
|
|||||||
|
|
||||||
if (status === "loading" || status === "unauthenticated") {
|
if (status === "loading" || status === "unauthenticated") {
|
||||||
return (
|
return (
|
||||||
<div className="min-h-screen bg-[#0f172a] flex items-center justify-center">
|
<div className="min-h-screen bg-[#0d0821] flex items-center justify-center">
|
||||||
<div className="animate-pulse flex flex-col items-center gap-4">
|
<div className="animate-pulse flex flex-col items-center gap-4">
|
||||||
<div className="h-12 w-12 rounded-xl bg-primary flex items-center justify-center shadow-lg shadow-primary/20">
|
<BrandLogo size={56} priority className="drop-shadow-[0_0_24px_rgba(255,81,249,0.4)]" />
|
||||||
<span className="font-black text-white italic text-xl">{process.env.NEXT_PUBLIC_BRAND_NAME_WORD || "AX"}</span>
|
|
||||||
</div>
|
|
||||||
<p className="text-slate-400 font-bold tracking-widest uppercase text-xs">
|
<p className="text-slate-400 font-bold tracking-widest uppercase text-xs">
|
||||||
Authenticating...
|
Authenticating...
|
||||||
</p>
|
</p>
|
||||||
@@ -159,10 +158,10 @@ export default function DashboardLayout({
|
|||||||
const BackLinkIcon = backLinkItem?.icon || Server;
|
const BackLinkIcon = backLinkItem?.icon || Server;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="min-h-screen bg-[#020617] text-slate-200">
|
<div className="min-h-screen bg-[#0d0821] text-slate-200">
|
||||||
{/* Liquid Background Elements */}
|
{/* Liquid Background Elements */}
|
||||||
<div className="fixed inset-0 overflow-hidden pointer-events-none z-0">
|
<div className="fixed inset-0 overflow-hidden pointer-events-none z-0">
|
||||||
<div className="absolute top-[-10%] right-[-10%] w-[40%] h-[40%] bg-red-500/5 blur-[120px] rounded-full animate-pulse" />
|
<div className="absolute top-[-10%] right-[-10%] w-[40%] h-[40%] bg-primary/5 blur-[120px] rounded-full animate-pulse" />
|
||||||
<div className="absolute bottom-[10%] left-[-5%] w-[30%] h-[30%] bg-indigo-500/5 blur-[100px] rounded-full animate-pulse [animation-delay:2s]" />
|
<div className="absolute bottom-[10%] left-[-5%] w-[30%] h-[30%] bg-indigo-500/5 blur-[100px] rounded-full animate-pulse [animation-delay:2s]" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -184,15 +183,13 @@ export default function DashboardLayout({
|
|||||||
{/* Header */}
|
{/* Header */}
|
||||||
<div className="flex h-16 items-center px-6 mt-4 flex-shrink-0">
|
<div className="flex h-16 items-center px-6 mt-4 flex-shrink-0">
|
||||||
<div className="flex items-center gap-3 group">
|
<div className="flex items-center gap-3 group">
|
||||||
<div className="h-9 w-9 rounded-xl bg-gradient-to-br from-red-500 to-red-800 flex items-center justify-center shadow-lg shadow-red-500/20 group-hover:scale-110 transition-transform border border-white/10">
|
<BrandLogo size={36} className="drop-shadow-[0_0_14px_rgba(255,81,249,0.35)] group-hover:scale-110 transition-transform" />
|
||||||
<Bot className="h-5 w-5 text-white" />
|
|
||||||
</div>
|
|
||||||
<div className="flex flex-col">
|
<div className="flex flex-col">
|
||||||
<h1 className="text-lg font-bold tracking-tight text-white font-outfit leading-none">
|
<h1 className="text-lg font-bold tracking-tight text-white font-outfit leading-none">
|
||||||
{process.env.NEXT_PUBLIC_BRAND_NAME || "Axiom"}
|
{process.env.NEXT_PUBLIC_BRAND_NAME || "Axiom"}
|
||||||
</h1>
|
</h1>
|
||||||
<span className="text-[9px] font-black uppercase tracking-[0.2em] text-red-500/80 mt-1">
|
<span className="text-[9px] font-black uppercase tracking-[0.2em] text-primary/80 mt-1">
|
||||||
Dashboard
|
by HexaHost
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -223,7 +220,7 @@ export default function DashboardLayout({
|
|||||||
className={cn(
|
className={cn(
|
||||||
"flex items-center gap-3 px-4 py-2.5 rounded-xl transition-all duration-300 group text-[13px] font-bold",
|
"flex items-center gap-3 px-4 py-2.5 rounded-xl transition-all duration-300 group text-[13px] font-bold",
|
||||||
isActive
|
isActive
|
||||||
? "bg-red-500/10 text-red-500 border border-red-500/20 shadow-[0_0_20px_rgba(239,68,68,0.1)]"
|
? "bg-primary/10 text-primary border border-primary/20 shadow-[0_0_20px_rgba(239,68,68,0.1)]"
|
||||||
: "text-slate-400 hover:bg-white/[0.03] hover:text-slate-200"
|
: "text-slate-400 hover:bg-white/[0.03] hover:text-slate-200"
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
@@ -231,13 +228,13 @@ export default function DashboardLayout({
|
|||||||
className={cn(
|
className={cn(
|
||||||
"h-4 w-4 transition-all duration-300",
|
"h-4 w-4 transition-all duration-300",
|
||||||
isActive
|
isActive
|
||||||
? "text-red-500 scale-110"
|
? "text-primary scale-110"
|
||||||
: "text-slate-600 group-hover:text-slate-400"
|
: "text-slate-600 group-hover:text-slate-400"
|
||||||
)}
|
)}
|
||||||
/>
|
/>
|
||||||
{subItem.name}
|
{subItem.name}
|
||||||
{isActive && (
|
{isActive && (
|
||||||
<div className="ml-auto w-1.5 h-1.5 rounded-full bg-red-500 animate-pulse shadow-[0_0_10px_rgba(239,68,68,0.5)]" />
|
<div className="ml-auto w-1.5 h-1.5 rounded-full bg-primary animate-pulse shadow-[0_0_10px_rgba(239,68,68,0.5)]" />
|
||||||
)}
|
)}
|
||||||
</Link>
|
</Link>
|
||||||
);
|
);
|
||||||
@@ -255,19 +252,19 @@ export default function DashboardLayout({
|
|||||||
className={cn(
|
className={cn(
|
||||||
"flex items-center gap-4 px-4 py-3 rounded-2xl transition-all duration-300 group text-[14px] font-bold",
|
"flex items-center gap-4 px-4 py-3 rounded-2xl transition-all duration-300 group text-[14px] font-bold",
|
||||||
isActive
|
isActive
|
||||||
? "bg-red-500/10 text-red-500 border border-red-500/20 shadow-[0_0_20px_rgba(239,68,68,0.1)]"
|
? "bg-primary/10 text-primary border border-primary/20 shadow-[0_0_20px_rgba(239,68,68,0.1)]"
|
||||||
: "text-slate-400 hover:bg-white/[0.03] hover:text-slate-200"
|
: "text-slate-400 hover:bg-white/[0.03] hover:text-slate-200"
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<item.icon
|
<item.icon
|
||||||
className={cn(
|
className={cn(
|
||||||
"h-5 w-5 transition-all duration-300",
|
"h-5 w-5 transition-all duration-300",
|
||||||
isActive ? "text-red-500 scale-110" : "text-slate-600 group-hover:text-slate-400"
|
isActive ? "text-primary scale-110" : "text-slate-600 group-hover:text-slate-400"
|
||||||
)}
|
)}
|
||||||
/>
|
/>
|
||||||
{item.name}
|
{item.name}
|
||||||
{isActive ? (
|
{isActive ? (
|
||||||
<ChevronRight className="ml-auto h-4 w-4 text-red-500" />
|
<ChevronRight className="ml-auto h-4 w-4 text-primary" />
|
||||||
) : (
|
) : (
|
||||||
<ChevronRight className="ml-auto h-4 w-4 opacity-0 group-hover:opacity-30 transition-opacity" />
|
<ChevronRight className="ml-auto h-4 w-4 opacity-0 group-hover:opacity-30 transition-opacity" />
|
||||||
)}
|
)}
|
||||||
@@ -285,7 +282,7 @@ export default function DashboardLayout({
|
|||||||
className={cn(
|
className={cn(
|
||||||
"flex items-center gap-4 px-4 py-3 rounded-2xl transition-all duration-300 group text-[14px] font-bold",
|
"flex items-center gap-4 px-4 py-3 rounded-2xl transition-all duration-300 group text-[14px] font-bold",
|
||||||
pathname === backLinkItem.href
|
pathname === backLinkItem.href
|
||||||
? "bg-red-500/10 text-red-500 border border-red-500/20 shadow-[0_0_20px_rgba(239,68,68,0.1)]"
|
? "bg-primary/10 text-primary border border-primary/20 shadow-[0_0_20px_rgba(239,68,68,0.1)]"
|
||||||
: "text-slate-400 hover:bg-white/[0.03] hover:text-slate-200"
|
: "text-slate-400 hover:bg-white/[0.03] hover:text-slate-200"
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
@@ -293,13 +290,13 @@ export default function DashboardLayout({
|
|||||||
className={cn(
|
className={cn(
|
||||||
"h-5 w-5 transition-all duration-300",
|
"h-5 w-5 transition-all duration-300",
|
||||||
pathname === backLinkItem.href
|
pathname === backLinkItem.href
|
||||||
? "text-red-500 scale-110"
|
? "text-primary scale-110"
|
||||||
: "text-slate-600 group-hover:text-slate-400"
|
: "text-slate-600 group-hover:text-slate-400"
|
||||||
)}
|
)}
|
||||||
/>
|
/>
|
||||||
{backLinkItem.name}
|
{backLinkItem.name}
|
||||||
{pathname === backLinkItem.href ? (
|
{pathname === backLinkItem.href ? (
|
||||||
<ChevronRight className="ml-auto h-4 w-4 text-red-500" />
|
<ChevronRight className="ml-auto h-4 w-4 text-primary" />
|
||||||
) : (
|
) : (
|
||||||
<ChevronRight className="ml-auto h-4 w-4 opacity-0 group-hover:opacity-30 transition-opacity" />
|
<ChevronRight className="ml-auto h-4 w-4 opacity-0 group-hover:opacity-30 transition-opacity" />
|
||||||
)}
|
)}
|
||||||
@@ -308,9 +305,9 @@ export default function DashboardLayout({
|
|||||||
)}
|
)}
|
||||||
|
|
||||||
{/* User Profile - now a normal flex child, no absolute positioning */}
|
{/* User Profile - now a normal flex child, no absolute positioning */}
|
||||||
<div className="flex-shrink-0 p-4 border-t border-white/5 glass-red bg-red-500/[0.02]">
|
<div className="flex-shrink-0 p-4 border-t border-white/5 glass-red bg-primary/[0.02]">
|
||||||
<div className="flex items-center gap-3 p-2 bg-white/[0.02] rounded-2xl border border-white/[0.05]">
|
<div className="flex items-center gap-3 p-2 bg-white/[0.02] rounded-2xl border border-white/[0.05]">
|
||||||
<div className="h-10 w-10 rounded-full bg-red-500/10 flex items-center justify-center ring-1 ring-white/10 overflow-hidden border border-red-500/20">
|
<div className="h-10 w-10 rounded-full bg-primary/10 flex items-center justify-center ring-1 ring-white/10 overflow-hidden border border-primary/20">
|
||||||
{session?.user?.image ? (
|
{session?.user?.image ? (
|
||||||
<img
|
<img
|
||||||
src={session.user.image}
|
src={session.user.image}
|
||||||
@@ -318,14 +315,14 @@ export default function DashboardLayout({
|
|||||||
className="h-full w-full object-cover opacity-80"
|
className="h-full w-full object-cover opacity-80"
|
||||||
/>
|
/>
|
||||||
) : (
|
) : (
|
||||||
<User className="h-6 w-6 text-red-500/50" />
|
<User className="h-6 w-6 text-primary/50" />
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
<div className="overflow-hidden">
|
<div className="overflow-hidden">
|
||||||
<p className="text-sm font-bold text-white truncate font-outfit">
|
<p className="text-sm font-bold text-white truncate font-outfit">
|
||||||
{session?.user?.name || "Administrator"}
|
{session?.user?.name || "Administrator"}
|
||||||
</p>
|
</p>
|
||||||
<p className="text-[10px] font-black uppercase text-red-500/60 truncate tracking-widest">
|
<p className="text-[10px] font-black uppercase text-primary/60 truncate tracking-widest">
|
||||||
User
|
User
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
@@ -345,11 +342,11 @@ export default function DashboardLayout({
|
|||||||
</button>
|
</button>
|
||||||
|
|
||||||
<div className="hidden md:flex items-center w-96 max-w-full relative group">
|
<div className="hidden md:flex items-center w-96 max-w-full relative group">
|
||||||
<Search className="absolute left-4 h-4 w-4 text-slate-500 group-focus-within:text-red-500 transition-colors" />
|
<Search className="absolute left-4 h-4 w-4 text-slate-500 group-focus-within:text-primary transition-colors" />
|
||||||
<input
|
<input
|
||||||
type="text"
|
type="text"
|
||||||
placeholder="Query neural network..."
|
placeholder="Query neural network..."
|
||||||
className="w-full bg-white/[0.03] border border-white/5 rounded-2xl py-2.5 pl-12 pr-4 text-xs font-bold text-slate-300 focus:outline-none focus:ring-1 focus:ring-red-500/30 focus:bg-white/[0.05] transition-all placeholder:text-slate-600"
|
className="w-full bg-white/[0.03] border border-white/5 rounded-2xl py-2.5 pl-12 pr-4 text-xs font-bold text-slate-300 focus:outline-none focus:ring-1 focus:ring-primary/30 focus:bg-white/[0.05] transition-all placeholder:text-slate-600"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -361,7 +358,7 @@ export default function DashboardLayout({
|
|||||||
>
|
>
|
||||||
<Bell className="h-5 w-5" />
|
<Bell className="h-5 w-5" />
|
||||||
{globalNotification && (
|
{globalNotification && (
|
||||||
<span className="absolute top-2 right-2 h-2 w-2 rounded-full bg-red-500 border-2 border-[#020617] shadow-[0_0_10px_rgba(239,68,68,0.5)]"></span>
|
<span className="absolute top-2 right-2 h-2 w-2 rounded-full bg-primary border-2 border-[#0d0821] shadow-[0_0_10px_rgba(255,81,249,0.5)]"></span>
|
||||||
)}
|
)}
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
@@ -371,17 +368,17 @@ export default function DashboardLayout({
|
|||||||
<p className="text-[10px] font-black text-slate-500 uppercase tracking-[0.2em]">Broadcast Metrics</p>
|
<p className="text-[10px] font-black text-slate-500 uppercase tracking-[0.2em]">Broadcast Metrics</p>
|
||||||
<button
|
<button
|
||||||
onClick={() => setGlobalNotification(null)}
|
onClick={() => setGlobalNotification(null)}
|
||||||
className="text-[10px] font-bold text-red-500/60 hover:text-red-500 transition-colors uppercase"
|
className="text-[10px] font-bold text-primary/60 hover:text-primary transition-colors uppercase"
|
||||||
>
|
>
|
||||||
Clear
|
Clear
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{globalNotification ? (
|
{globalNotification ? (
|
||||||
<div className="bg-red-500/5 border border-red-500/10 rounded-2xl p-4">
|
<div className="bg-primary/5 border border-primary/10 rounded-2xl p-4">
|
||||||
<div className="flex items-center gap-2 mb-2">
|
<div className="flex items-center gap-2 mb-2">
|
||||||
<Sparkles className="h-3 w-3 text-red-500" />
|
<Sparkles className="h-3 w-3 text-primary" />
|
||||||
<span className="text-[10px] font-black uppercase text-red-500 tracking-widest">System Broadcast</span>
|
<span className="text-[10px] font-black uppercase text-primary tracking-widest">System Broadcast</span>
|
||||||
</div>
|
</div>
|
||||||
<p className="text-xs font-medium text-slate-300 leading-relaxed">
|
<p className="text-xs font-medium text-slate-300 leading-relaxed">
|
||||||
{globalNotification}
|
{globalNotification}
|
||||||
@@ -407,18 +404,18 @@ export default function DashboardLayout({
|
|||||||
onClick={() => setIsProfileOpen(!isProfileOpen)}
|
onClick={() => setIsProfileOpen(!isProfileOpen)}
|
||||||
className="flex items-center gap-3.5 p-1.5 rounded-2xl hover:bg-white/5 transition-all group border border-transparent hover:border-white/10"
|
className="flex items-center gap-3.5 p-1.5 rounded-2xl hover:bg-white/5 transition-all group border border-transparent hover:border-white/10"
|
||||||
>
|
>
|
||||||
<div className="h-9 w-9 rounded-full bg-red-500/10 flex items-center justify-center overflow-hidden border border-red-500/20 ring-2 ring-transparent group-hover:ring-red-500/30 transition-all">
|
<div className="h-9 w-9 rounded-full bg-primary/10 flex items-center justify-center overflow-hidden border border-primary/20 ring-2 ring-transparent group-hover:ring-primary/30 transition-all">
|
||||||
{session?.user?.image ? (
|
{session?.user?.image ? (
|
||||||
<img src={session.user.image} alt="User Avatar" className="h-full w-full object-cover opacity-80" />
|
<img src={session.user.image} alt="User Avatar" className="h-full w-full object-cover opacity-80" />
|
||||||
) : (
|
) : (
|
||||||
<User className="h-5 w-5 text-red-500/50" />
|
<User className="h-5 w-5 text-primary/50" />
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
<div className="hidden sm:flex flex-col items-start leading-none gap-1">
|
<div className="hidden sm:flex flex-col items-start leading-none gap-1">
|
||||||
<span className="text-xs font-bold text-slate-200 group-hover:text-white transition-colors">
|
<span className="text-xs font-bold text-slate-200 group-hover:text-white transition-colors">
|
||||||
{session?.user?.name?.split(' ')[0] || "Admin"}
|
{session?.user?.name?.split(' ')[0] || "Admin"}
|
||||||
</span>
|
</span>
|
||||||
<span className="text-[9px] font-black uppercase text-red-500/60 tracking-widest">Active</span>
|
<span className="text-[9px] font-black uppercase text-primary/60 tracking-widest">Active</span>
|
||||||
</div>
|
</div>
|
||||||
<ChevronDown
|
<ChevronDown
|
||||||
className={cn("h-4 w-4 text-slate-600 transition-transform hidden sm:block", isProfileOpen && "rotate-180")}
|
className={cn("h-4 w-4 text-slate-600 transition-transform hidden sm:block", isProfileOpen && "rotate-180")}
|
||||||
@@ -433,13 +430,13 @@ export default function DashboardLayout({
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<button className="w-full flex items-center gap-3 px-4 py-3 rounded-xl text-xs font-bold text-slate-400 hover:bg-white/5 hover:text-white transition-all group/item">
|
<button className="w-full flex items-center gap-3 px-4 py-3 rounded-xl text-xs font-bold text-slate-400 hover:bg-white/5 hover:text-white transition-all group/item">
|
||||||
<LifeBuoy className="h-4 w-4 text-slate-600 group-hover/item:text-red-500 transition-colors" />
|
<LifeBuoy className="h-4 w-4 text-slate-600 group-hover/item:text-primary transition-colors" />
|
||||||
Support Matrix
|
Support Matrix
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
<button
|
<button
|
||||||
onClick={() => signOut({ callbackUrl: '/' })}
|
onClick={() => signOut({ callbackUrl: '/' })}
|
||||||
className="w-full flex items-center gap-3 px-4 py-3 rounded-xl text-xs font-black uppercase tracking-widest text-red-500/80 hover:bg-red-500/10 hover:text-red-500 transition-all group/item"
|
className="w-full flex items-center gap-3 px-4 py-3 rounded-xl text-xs font-black uppercase tracking-widest text-primary/80 hover:bg-primary/10 hover:text-primary transition-all group/item"
|
||||||
>
|
>
|
||||||
<LogOut className="h-4 w-4" />
|
<LogOut className="h-4 w-4" />
|
||||||
Deauthorize
|
Deauthorize
|
||||||
|
|||||||
@@ -56,14 +56,14 @@ export default async function DashboardPage() {
|
|||||||
<div className="space-y-10 animate-in fade-in slide-in-from-bottom-4 duration-700">
|
<div className="space-y-10 animate-in fade-in slide-in-from-bottom-4 duration-700">
|
||||||
<div className="flex flex-col md:flex-row md:items-end justify-between gap-6 px-2">
|
<div className="flex flex-col md:flex-row md:items-end justify-between gap-6 px-2">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-4xl md:text-5xl font-bold text-white font-outfit tracking-tight">System <span className="text-red-500 italic">Core.</span></h1>
|
<h1 className="text-4xl md:text-5xl font-bold text-white font-outfit tracking-tight">System <span className="text-primary italic">Core.</span></h1>
|
||||||
<p className="text-slate-400 mt-3 font-medium flex items-center gap-2">
|
<p className="text-slate-400 mt-3 font-medium flex items-center gap-2">
|
||||||
Status and live metrics for <span className="text-red-500 font-bold px-2 py-0.5 rounded-lg bg-red-500/10 border border-red-500/20">{botInfo.name}</span>
|
Status and live metrics for <span className="text-primary font-bold px-2 py-0.5 rounded-lg bg-primary/10 border border-primary/20">{botInfo.name}</span>
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{error && (
|
{error && (
|
||||||
<div className="flex items-center gap-2 px-5 py-2.5 glass-red rounded-2xl text-red-500 text-xs font-bold uppercase tracking-widest animate-pulse">
|
<div className="flex items-center gap-2 px-5 py-2.5 glass-red rounded-2xl text-primary text-xs font-bold uppercase tracking-widest animate-pulse">
|
||||||
<ShieldAlert className="h-4 w-4" />
|
<ShieldAlert className="h-4 w-4" />
|
||||||
<span>{error}</span>
|
<span>{error}</span>
|
||||||
</div>
|
</div>
|
||||||
@@ -73,21 +73,21 @@ export default async function DashboardPage() {
|
|||||||
{/* Stats Grid */}
|
{/* Stats Grid */}
|
||||||
<div className="grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-4">
|
<div className="grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-4">
|
||||||
{stats.map((stat) => (
|
{stats.map((stat) => (
|
||||||
<div key={stat.name} className="group glass border-white/5 p-7 rounded-[32px] relative overflow-hidden hover:border-red-500/30 transition-all duration-500 shadow-2xl">
|
<div key={stat.name} className="group glass border-white/5 p-7 rounded-[32px] relative overflow-hidden hover:border-primary/30 transition-all duration-500 shadow-2xl">
|
||||||
{/* Animated Glow Overlay */}
|
{/* Animated Glow Overlay */}
|
||||||
<div className="absolute inset-0 bg-gradient-to-br from-red-500/5 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-500" />
|
<div className="absolute inset-0 bg-gradient-to-br from-primary/5 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-500" />
|
||||||
|
|
||||||
<div className="flex items-center justify-between relative z-10">
|
<div className="flex items-center justify-between relative z-10">
|
||||||
<div>
|
<div>
|
||||||
<p className="text-[10px] font-black text-slate-500 uppercase tracking-[0.2em] mb-2">{stat.name}</p>
|
<p className="text-[10px] font-black text-slate-500 uppercase tracking-[0.2em] mb-2">{stat.name}</p>
|
||||||
<p className="text-3xl font-bold text-white font-outfit tracking-tight">{stat.value}</p>
|
<p className="text-3xl font-bold text-white font-outfit tracking-tight">{stat.value}</p>
|
||||||
</div>
|
</div>
|
||||||
<div className="p-4 bg-red-500/10 rounded-2xl border border-red-500/20 group-hover:scale-110 group-hover:bg-red-500/20 transition-all duration-500">
|
<div className="p-4 bg-primary/10 rounded-2xl border border-primary/20 group-hover:scale-110 group-hover:bg-primary/20 transition-all duration-500">
|
||||||
<stat.icon className="h-6 w-6 text-red-500" />
|
<stat.icon className="h-6 w-6 text-primary" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="absolute bottom-0 left-12 right-12 h-[1px] bg-red-500/50 blur-[1px] opacity-0 group-hover:opacity-100 transition-opacity duration-500" />
|
<div className="absolute bottom-0 left-12 right-12 h-[1px] bg-primary/50 blur-[1px] opacity-0 group-hover:opacity-100 transition-opacity duration-500" />
|
||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
@@ -95,13 +95,13 @@ export default async function DashboardPage() {
|
|||||||
{/* Featured Modules & Support */}
|
{/* Featured Modules & Support */}
|
||||||
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8">
|
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8">
|
||||||
<div className="lg:col-span-2 glass border-white/5 rounded-[40px] p-10 relative group overflow-hidden shadow-2xl">
|
<div className="lg:col-span-2 glass border-white/5 rounded-[40px] p-10 relative group overflow-hidden shadow-2xl">
|
||||||
<div className="absolute inset-0 bg-gradient-to-br from-red-500/[0.03] to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-700" />
|
<div className="absolute inset-0 bg-gradient-to-br from-primary/[0.03] to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-700" />
|
||||||
|
|
||||||
<div className="flex items-center justify-between mb-8 relative z-10">
|
<div className="flex items-center justify-between mb-8 relative z-10">
|
||||||
<h2 className="text-2xl font-bold text-white font-outfit tracking-tight">Quick Actions</h2>
|
<h2 className="text-2xl font-bold text-white font-outfit tracking-tight">Quick Actions</h2>
|
||||||
<div className="flex items-center gap-2 px-3 py-1 rounded-full bg-red-500/10 border border-red-500/20">
|
<div className="flex items-center gap-2 px-3 py-1 rounded-full bg-primary/10 border border-primary/20">
|
||||||
<Zap className="h-3 w-3 text-red-500" />
|
<Zap className="h-3 w-3 text-primary" />
|
||||||
<span className="text-[10px] font-black text-red-500 uppercase tracking-widest">Efficiency</span>
|
<span className="text-[10px] font-black text-primary uppercase tracking-widest">Efficiency</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -112,12 +112,12 @@ export default async function DashboardPage() {
|
|||||||
{ title: "Support Matrix", desc: "Get help from our neural support team.", icon: LifeBuoy, href: "#" },
|
{ title: "Support Matrix", desc: "Get help from our neural support team.", icon: LifeBuoy, href: "#" },
|
||||||
{ title: "Documentation", desc: "Learn how to master the Axiom engine.", icon: FileText, href: "#" },
|
{ title: "Documentation", desc: "Learn how to master the Axiom engine.", icon: FileText, href: "#" },
|
||||||
].map((item) => (
|
].map((item) => (
|
||||||
<a key={item.title} href={item.href} className="flex items-center gap-5 p-4 rounded-2xl bg-white/[0.02] border border-white/[0.03] group/item hover:bg-white/[0.05] hover:border-red-500/20 transition-all">
|
<a key={item.title} href={item.href} className="flex items-center gap-5 p-4 rounded-2xl bg-white/[0.02] border border-white/[0.03] group/item hover:bg-white/[0.05] hover:border-primary/20 transition-all">
|
||||||
<div className="h-12 w-12 rounded-2xl bg-red-500/5 border border-red-500/10 flex items-center justify-center group-hover/item:bg-red-500/10 transition-colors">
|
<div className="h-12 w-12 rounded-2xl bg-primary/5 border border-primary/10 flex items-center justify-center group-hover/item:bg-primary/10 transition-colors">
|
||||||
<item.icon className="h-5 w-5 text-red-500/60 group-hover/item:text-red-500 transition-colors" />
|
<item.icon className="h-5 w-5 text-primary/60 group-hover/item:text-primary transition-colors" />
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h4 className="text-sm font-bold text-white group-hover/item:text-red-500 transition-colors">{item.title}</h4>
|
<h4 className="text-sm font-bold text-white group-hover/item:text-primary transition-colors">{item.title}</h4>
|
||||||
<p className="text-[10px] text-slate-500 font-medium uppercase tracking-wider">{item.desc}</p>
|
<p className="text-[10px] text-slate-500 font-medium uppercase tracking-wider">{item.desc}</p>
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
@@ -126,7 +126,7 @@ export default async function DashboardPage() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="glass border-white/5 rounded-[40px] p-10 flex flex-col justify-between relative group shadow-2xl overflow-hidden">
|
<div className="glass border-white/5 rounded-[40px] p-10 flex flex-col justify-between relative group shadow-2xl overflow-hidden">
|
||||||
<div className="absolute inset-0 bg-gradient-to-bl from-red-500/[0.05] to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-700" />
|
<div className="absolute inset-0 bg-gradient-to-bl from-primary/[0.05] to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-700" />
|
||||||
|
|
||||||
<div className="relative z-10">
|
<div className="relative z-10">
|
||||||
<h2 className="text-2xl font-bold text-white mb-3 font-outfit">Module Status</h2>
|
<h2 className="text-2xl font-bold text-white mb-3 font-outfit">Module Status</h2>
|
||||||
@@ -138,7 +138,7 @@ export default async function DashboardPage() {
|
|||||||
{ name: 'Database Cluster', status: 'Synchronized' },
|
{ name: 'Database Cluster', status: 'Synchronized' },
|
||||||
{ name: 'Edge Shards', status: 'Operational' }
|
{ name: 'Edge Shards', status: 'Operational' }
|
||||||
].map((service) => (
|
].map((service) => (
|
||||||
<div key={service.name} className="flex items-center justify-between p-4 bg-white/[0.02] rounded-2xl border border-white/[0.05] hover:border-red-500/20 transition-colors">
|
<div key={service.name} className="flex items-center justify-between p-4 bg-white/[0.02] rounded-2xl border border-white/[0.05] hover:border-primary/20 transition-colors">
|
||||||
<span className="text-xs font-bold text-slate-300">{service.name}</span>
|
<span className="text-xs font-bold text-slate-300">{service.name}</span>
|
||||||
<div className="flex items-center gap-3">
|
<div className="flex items-center gap-3">
|
||||||
<div className="h-1.5 w-1.5 rounded-full bg-emerald-500 shadow-[0_0_10px_rgba(16,185,129,0.5)]" />
|
<div className="h-1.5 w-1.5 rounded-full bg-emerald-500 shadow-[0_0_10px_rgba(16,185,129,0.5)]" />
|
||||||
@@ -149,11 +149,11 @@ export default async function DashboardPage() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<button className="mt-12 w-full py-4 glass-red hover:bg-red-500/10 text-red-500 rounded-[20px] text-[11px] font-black uppercase tracking-[0.2em] transition-all border border-red-500/20 relative z-10">
|
<button className="mt-12 w-full py-4 glass-red hover:bg-primary/10 text-primary rounded-[20px] text-[11px] font-black uppercase tracking-[0.2em] transition-all border border-primary/20 relative z-10">
|
||||||
System Diagnostics
|
System Diagnostics
|
||||||
</button>
|
</button>
|
||||||
{/* Abstract Design Element */}
|
{/* Abstract Design Element */}
|
||||||
<div className="absolute -bottom-10 -right-10 h-32 w-32 bg-red-500/10 blur-3xl rounded-full" />
|
<div className="absolute -bottom-10 -right-10 h-32 w-32 bg-primary/10 blur-3xl rounded-full" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -17,7 +17,6 @@
|
|||||||
import React, { useState } from "react";
|
import React, { useState } from "react";
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
import {
|
import {
|
||||||
Bot,
|
|
||||||
ChevronLeft,
|
ChevronLeft,
|
||||||
Search,
|
Search,
|
||||||
ShieldCheck,
|
ShieldCheck,
|
||||||
@@ -31,6 +30,7 @@ import {
|
|||||||
X
|
X
|
||||||
} from "lucide-react";
|
} from "lucide-react";
|
||||||
import { Button } from "@/components/ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
|
import { BrandLogo } from "@/components/brand-logo";
|
||||||
import { cn } from "@/lib/utils";
|
import { cn } from "@/lib/utils";
|
||||||
|
|
||||||
const DOCS_NAV = [
|
const DOCS_NAV = [
|
||||||
@@ -65,28 +65,26 @@ export default function DocsPage() {
|
|||||||
const [activeTab, setActiveTab] = useState("Introduction");
|
const [activeTab, setActiveTab] = useState("Introduction");
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="min-h-screen bg-[#020617] text-slate-200 font-sans">
|
<div className="min-h-screen bg-[#0d0821] text-slate-200 font-sans">
|
||||||
{/* Background Decor */}
|
{/* Background Decor */}
|
||||||
<div className="fixed inset-0 overflow-hidden pointer-events-none z-0">
|
<div className="fixed inset-0 overflow-hidden pointer-events-none z-0">
|
||||||
<div className="absolute top-[-10%] left-[-10%] w-[50%] h-[50%] bg-red-500/[0.02] blur-[150px] rounded-full" />
|
<div className="absolute top-[-10%] left-[-10%] w-[50%] h-[50%] bg-primary/[0.02] blur-[150px] rounded-full" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Nav */}
|
{/* Nav */}
|
||||||
<nav className="fixed top-0 w-full z-50 border-b border-white/[0.03] bg-[#020617]/80 backdrop-blur-3xl px-6 h-20 flex items-center justify-between">
|
<nav className="fixed top-0 w-full z-50 border-b border-white/[0.03] bg-[#0d0821]/80 backdrop-blur-3xl px-6 h-20 flex items-center justify-between">
|
||||||
<div className="flex items-center gap-8">
|
<div className="flex items-center gap-8">
|
||||||
<Link href="/" className="flex items-center gap-4 group">
|
<Link href="/" className="flex items-center gap-4 group">
|
||||||
<div className="h-8 w-8 rounded-lg bg-red-600 flex items-center justify-center mr-3">
|
<BrandLogo size={32} className="group-hover:scale-110 transition-transform" />
|
||||||
<Bot className="h-5 w-5 text-white" />
|
|
||||||
</div>
|
|
||||||
<span className="text-xl font-bold text-white font-outfit uppercase tracking-tighter hidden md:block">Axiom Docs</span>
|
<span className="text-xl font-bold text-white font-outfit uppercase tracking-tighter hidden md:block">Axiom Docs</span>
|
||||||
</Link>
|
</Link>
|
||||||
|
|
||||||
<div className="hidden lg:flex items-center w-80 relative group">
|
<div className="hidden lg:flex items-center w-80 relative group">
|
||||||
<SearchIcon className="absolute left-4 h-4 w-4 text-slate-500 group-focus-within:text-red-500 transition-colors" />
|
<SearchIcon className="absolute left-4 h-4 w-4 text-slate-500 group-focus-within:text-primary transition-colors" />
|
||||||
<input
|
<input
|
||||||
type="text"
|
type="text"
|
||||||
placeholder="Search documentation..."
|
placeholder="Search documentation..."
|
||||||
className="w-full bg-white/[0.03] border border-white/5 rounded-2xl py-2.5 pl-12 pr-4 text-xs font-bold text-slate-300 focus:outline-none focus:ring-1 focus:ring-red-500/30 focus:bg-white/[0.05] transition-all"
|
className="w-full bg-white/[0.03] border border-white/5 rounded-2xl py-2.5 pl-12 pr-4 text-xs font-bold text-slate-300 focus:outline-none focus:ring-1 focus:ring-primary/30 focus:bg-white/[0.05] transition-all"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -109,7 +107,7 @@ export default function DocsPage() {
|
|||||||
<div className="max-w-7xl mx-auto flex pt-20">
|
<div className="max-w-7xl mx-auto flex pt-20">
|
||||||
{/* Sidebar */}
|
{/* Sidebar */}
|
||||||
<aside className={cn(
|
<aside className={cn(
|
||||||
"fixed inset-y-0 left-0 z-40 w-80 bg-[#020617] border-r border-white/5 pt-20 transition-transform lg:translate-x-0 lg:static lg:bg-transparent",
|
"fixed inset-y-0 left-0 z-40 w-80 bg-[#0d0821] border-r border-white/5 pt-20 transition-transform lg:translate-x-0 lg:static lg:bg-transparent",
|
||||||
isSidebarOpen ? "translate-x-0" : "-translate-x-full"
|
isSidebarOpen ? "translate-x-0" : "-translate-x-full"
|
||||||
)}>
|
)}>
|
||||||
<div className="h-full p-8 overflow-y-auto no-scrollbar">
|
<div className="h-full p-8 overflow-y-auto no-scrollbar">
|
||||||
@@ -127,11 +125,11 @@ export default function DocsPage() {
|
|||||||
className={cn(
|
className={cn(
|
||||||
"w-full flex flex-col items-start gap-1 p-4 rounded-2xl transition-all text-left",
|
"w-full flex flex-col items-start gap-1 p-4 rounded-2xl transition-all text-left",
|
||||||
activeTab === item.name
|
activeTab === item.name
|
||||||
? "bg-red-500/10 border border-red-500/20 shadow-[0_0_20px_rgba(239,68,68,0.05)]"
|
? "bg-primary/10 border border-primary/20 shadow-[0_0_20px_rgba(239,68,68,0.05)]"
|
||||||
: "hover:bg-white/[0.02] border border-transparent"
|
: "hover:bg-white/[0.02] border border-transparent"
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<span className={cn("text-sm font-bold", activeTab === item.name ? "text-red-500" : "text-slate-300")}>{item.name}</span>
|
<span className={cn("text-sm font-bold", activeTab === item.name ? "text-primary" : "text-slate-300")}>{item.name}</span>
|
||||||
<span className="text-[10px] text-slate-600 font-bold uppercase tracking-tight">{item.description}</span>
|
<span className="text-[10px] text-slate-600 font-bold uppercase tracking-tight">{item.description}</span>
|
||||||
</button>
|
</button>
|
||||||
))}
|
))}
|
||||||
@@ -143,13 +141,13 @@ export default function DocsPage() {
|
|||||||
|
|
||||||
{/* Content */}
|
{/* Content */}
|
||||||
<main className="flex-1 p-8 lg:p-16 relative z-10 max-w-4xl">
|
<main className="flex-1 p-8 lg:p-16 relative z-10 max-w-4xl">
|
||||||
<div className="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-red-500/10 border border-red-500/20 text-red-500 text-[10px] font-black uppercase tracking-widest mb-8">
|
<div className="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-primary/10 border border-primary/20 text-primary text-[10px] font-black uppercase tracking-widest mb-8">
|
||||||
<BookOpen className="h-3 w-3" />
|
<BookOpen className="h-3 w-3" />
|
||||||
V2.4 Runtime Environment
|
V2.4 Runtime Environment
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<h1 className="text-6xl font-bold text-white font-outfit tracking-tighter uppercase mb-8 italic">
|
<h1 className="text-6xl font-bold text-white font-outfit tracking-tighter uppercase mb-8 italic">
|
||||||
{activeTab}<span className="text-red-500 not-italic">.</span>
|
{activeTab}<span className="text-primary not-italic">.</span>
|
||||||
</h1>
|
</h1>
|
||||||
|
|
||||||
<div className="prose prose-invert max-w-none">
|
<div className="prose prose-invert max-w-none">
|
||||||
@@ -159,7 +157,7 @@ export default function DocsPage() {
|
|||||||
|
|
||||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||||
<div className="p-8 rounded-[32px] glass border-white/5 space-y-4">
|
<div className="p-8 rounded-[32px] glass border-white/5 space-y-4">
|
||||||
<Zap className="h-6 w-6 text-red-500" />
|
<Zap className="h-6 w-6 text-primary" />
|
||||||
<h3 className="text-xl font-bold text-white font-outfit uppercase">Fast Dispatch</h3>
|
<h3 className="text-xl font-bold text-white font-outfit uppercase">Fast Dispatch</h3>
|
||||||
<p className="text-sm text-slate-500 font-bold uppercase tracking-tight">Commands are dispatched via our global edge network in under 12ms.</p>
|
<p className="text-sm text-slate-500 font-bold uppercase tracking-tight">Commands are dispatched via our global edge network in under 12ms.</p>
|
||||||
</div>
|
</div>
|
||||||
@@ -170,16 +168,16 @@ export default function DocsPage() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="p-8 rounded-[40px] bg-red-500/[0.02] border border-red-500/10 relative overflow-hidden">
|
<div className="p-8 rounded-[40px] bg-primary/[0.02] border border-primary/10 relative overflow-hidden">
|
||||||
<div className="absolute top-0 right-0 p-8 opacity-10">
|
<div className="absolute top-0 right-0 p-8 opacity-10">
|
||||||
<Layers className="h-32 w-32 text-red-500" />
|
<Layers className="h-32 w-32 text-primary" />
|
||||||
</div>
|
</div>
|
||||||
<h2 className="text-2xl font-bold text-white font-outfit uppercase tracking-tight mb-4">Neural Architecture</h2>
|
<h2 className="text-2xl font-bold text-white font-outfit uppercase tracking-tight mb-4">Neural Architecture</h2>
|
||||||
<h3 className="text-white font-bold">Protocol Overview</h3>
|
<h3 className="text-white font-bold">Protocol Overview</h3>
|
||||||
<p className="text-slate-500 font-bold leading-relaxed mb-8">
|
<p className="text-slate-500 font-bold leading-relaxed mb-8">
|
||||||
The Axiom Engine utilizes a decentralized event stream processing model. When a Discord event is received, it is instantly routed to the nearest edge cluster.
|
The Axiom Engine utilizes a decentralized event stream processing model. When a Discord event is received, it is instantly routed to the nearest edge cluster.
|
||||||
</p>
|
</p>
|
||||||
<div className="bg-black/40 p-6 rounded-2xl border border-white/5 font-mono text-sm text-red-500 mb-8">
|
<div className="bg-black/40 p-6 rounded-2xl border border-white/5 font-mono text-sm text-primary mb-8">
|
||||||
$ hexahost initialize --cluster-shard [neural_07] --mode enterprise
|
$ hexahost initialize --cluster-shard [neural_07] --mode enterprise
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -191,8 +189,8 @@ export default function DocsPage() {
|
|||||||
<p className="text-sm font-bold text-slate-400">DOC-ID: CX_7749_B</p>
|
<p className="text-sm font-bold text-slate-400">DOC-ID: CX_7749_B</p>
|
||||||
</div>
|
</div>
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
<div className="h-2 w-2 rounded-full bg-red-500 animate-pulse" />
|
<div className="h-2 w-2 rounded-full bg-primary animate-pulse" />
|
||||||
<span className="text-[10px] font-black uppercase text-red-500 tracking-[0.2em]">Live Stream Active</span>
|
<span className="text-[10px] font-black uppercase text-primary tracking-[0.2em]">Live Stream Active</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
|
|||||||
@@ -2,20 +2,28 @@
|
|||||||
@tailwind components;
|
@tailwind components;
|
||||||
@tailwind utilities;
|
@tailwind utilities;
|
||||||
|
|
||||||
|
/* HexaHost.de palette — Axiom product UI */
|
||||||
:root {
|
:root {
|
||||||
--background: #020617;
|
--background: #0d0821;
|
||||||
--foreground: #f8fafc;
|
--foreground: #ffffff;
|
||||||
--primary: #ef4444;
|
--primary: #ff51f9;
|
||||||
--primary-glow: rgba(239, 68, 68, 0.15);
|
--primary-hover: #c31adf;
|
||||||
--glass-bg: rgba(15, 23, 42, 0.6);
|
--primary-glow: rgba(255, 81, 249, 0.18);
|
||||||
--glass-border: rgba(255, 255, 255, 0.05);
|
--accent: #a348ff;
|
||||||
--glass-red-border: rgba(239, 68, 68, 0.2);
|
--accent-blue: #3978ff;
|
||||||
|
--accent-neon: #00cfff;
|
||||||
|
--highlight: #f093ff;
|
||||||
|
--neutral-light: #1a1230;
|
||||||
|
--text-secondary: #cfc9dd;
|
||||||
|
--glass-bg: rgba(255, 255, 255, 0.05);
|
||||||
|
--glass-border: rgba(255, 255, 255, 0.1);
|
||||||
|
--glass-primary-border: rgba(255, 81, 249, 0.25);
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (prefers-color-scheme: dark) {
|
@media (prefers-color-scheme: dark) {
|
||||||
:root {
|
:root {
|
||||||
--background: #020617;
|
--background: #0d0821;
|
||||||
--foreground: #f8fafc;
|
--foreground: #ffffff;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -32,23 +40,23 @@ body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
::-webkit-scrollbar-track {
|
::-webkit-scrollbar-track {
|
||||||
background: #020617;
|
background: #0d0821;
|
||||||
}
|
}
|
||||||
|
|
||||||
::-webkit-scrollbar-thumb {
|
::-webkit-scrollbar-thumb {
|
||||||
background: #1e293b;
|
background: #1a1230;
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
border: 2px solid #020617;
|
border: 2px solid #0d0821;
|
||||||
}
|
}
|
||||||
|
|
||||||
::-webkit-scrollbar-thumb:hover {
|
::-webkit-scrollbar-thumb:hover {
|
||||||
background: #ef4444; /* Primary Red */
|
background: #ff51f9;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Firefox */
|
/* Firefox */
|
||||||
* {
|
* {
|
||||||
scrollbar-width: thin;
|
scrollbar-width: thin;
|
||||||
scrollbar-color: #1e293b #020617;
|
scrollbar-color: #1a1230 #0d0821;
|
||||||
}
|
}
|
||||||
|
|
||||||
@layer utilities {
|
@layer utilities {
|
||||||
@@ -66,12 +74,14 @@ body {
|
|||||||
@apply backdrop-blur-xl bg-white/[0.02] border border-white/[0.05];
|
@apply backdrop-blur-xl bg-white/[0.02] border border-white/[0.05];
|
||||||
}
|
}
|
||||||
.glass-red {
|
.glass-red {
|
||||||
@apply backdrop-blur-xl bg-red-500/[0.02] border border-red-500/[0.1];
|
@apply backdrop-blur-xl border;
|
||||||
|
background: rgba(255, 81, 249, 0.03);
|
||||||
|
border-color: rgba(255, 81, 249, 0.12);
|
||||||
}
|
}
|
||||||
.liquid-glass {
|
.liquid-glass {
|
||||||
background: linear-gradient(135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0) 100%);
|
background: linear-gradient(135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0) 100%);
|
||||||
backdrop-filter: blur(20px);
|
backdrop-filter: blur(20px);
|
||||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||||
box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
|
box-shadow: 0 8px 32px 0 rgba(255, 81, 249, 0.12);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -25,8 +25,17 @@ const outfit = Outfit({ subsets: ["latin"], variable: "--font-outfit" });
|
|||||||
const brandName = process.env.NEXT_PUBLIC_BRAND_NAME || "Axiom";
|
const brandName = process.env.NEXT_PUBLIC_BRAND_NAME || "Axiom";
|
||||||
|
|
||||||
export const metadata: Metadata = {
|
export const metadata: Metadata = {
|
||||||
title: `${brandName} - Ultimate Discord Bot`,
|
title: `${brandName} — by HexaHost`,
|
||||||
description: "Advanced Discord community management and security.",
|
description: "Axiom Discord Bot Dashboard — powered by HexaHost.",
|
||||||
|
icons: {
|
||||||
|
icon: [
|
||||||
|
{ url: "/favicon.svg", type: "image/svg+xml" },
|
||||||
|
{ url: "/favicon.ico" },
|
||||||
|
{ url: "/favicon-32.png", sizes: "32x32", type: "image/png" },
|
||||||
|
],
|
||||||
|
apple: [{ url: "/apple-touch-icon.png", sizes: "180x180" }],
|
||||||
|
shortcut: "/favicon.ico",
|
||||||
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
export default function RootLayout({
|
export default function RootLayout({
|
||||||
|
|||||||
@@ -43,41 +43,40 @@ import {
|
|||||||
User
|
User
|
||||||
} from "lucide-react";
|
} from "lucide-react";
|
||||||
import { Button } from "@/components/ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
|
import { BrandLogo } from "@/components/brand-logo";
|
||||||
import { cn } from "@/lib/utils";
|
import { cn } from "@/lib/utils";
|
||||||
|
|
||||||
export default function LandingPage() {
|
export default function LandingPage() {
|
||||||
return (
|
return (
|
||||||
<div className="min-h-screen bg-[#020617] text-slate-200 selection:bg-red-500/30 font-sans overflow-x-hidden">
|
<div className="min-h-screen bg-[#0d0821] text-slate-200 selection:bg-primary/30 font-sans overflow-x-hidden">
|
||||||
{/* Dynamic Background */}
|
{/* Dynamic Background */}
|
||||||
<div className="fixed inset-0 overflow-hidden pointer-events-none z-0">
|
<div className="fixed inset-0 overflow-hidden pointer-events-none z-0">
|
||||||
<div className="absolute top-[-20%] left-[-10%] w-[70%] h-[70%] bg-red-500/[0.03] blur-[150px] rounded-full animate-pulse" />
|
<div className="absolute top-[-20%] left-[-10%] w-[70%] h-[70%] bg-primary/[0.03] blur-[150px] rounded-full animate-pulse" />
|
||||||
<div className="absolute bottom-[-10%] right-[-10%] w-[60%] h-[60%] bg-red-600/[0.03] blur-[150px] rounded-full animate-pulse [animation-delay:2s]" />
|
<div className="absolute bottom-[-10%] right-[-10%] w-[60%] h-[60%] bg-accent/[0.05] blur-[150px] rounded-full animate-pulse [animation-delay:2s]" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Navigation */}
|
{/* Navigation */}
|
||||||
<nav className="fixed top-0 w-full z-50 border-b border-white/[0.03] bg-[#020617]/80 backdrop-blur-3xl transition-all duration-500">
|
<nav className="fixed top-0 w-full z-50 border-b border-white/[0.03] bg-[#0d0821]/80 backdrop-blur-3xl transition-all duration-500">
|
||||||
<div className="max-w-7xl mx-auto px-6 h-20 flex items-center justify-between">
|
<div className="max-w-7xl mx-auto px-6 h-20 flex items-center justify-between">
|
||||||
<div className="flex items-center gap-4 group cursor-pointer">
|
<div className="flex items-center gap-4 group cursor-pointer">
|
||||||
<div className="h-11 w-11 rounded-2xl bg-gradient-to-br from-red-500 to-red-800 flex items-center justify-center shadow-lg shadow-red-500/25 border border-white/20 group-hover:scale-110 group-hover:rotate-6 transition-all duration-500">
|
<BrandLogo size={44} priority className="drop-shadow-[0_0_18px_rgba(255,81,249,0.35)] group-hover:scale-110 group-hover:rotate-6 transition-all duration-500" />
|
||||||
<Bot className="h-6 w-6 text-white" />
|
|
||||||
</div>
|
|
||||||
<div className="flex flex-col">
|
<div className="flex flex-col">
|
||||||
<h1 className="text-lg font-bold tracking-tight text-white font-outfit leading-none">{process.env.NEXT_PUBLIC_BRAND_NAME || "Axiom"}</h1>
|
<h1 className="text-lg font-bold tracking-tight text-white font-outfit leading-none">{process.env.NEXT_PUBLIC_BRAND_NAME || "Axiom"}</h1>
|
||||||
<span className="text-[9px] font-black uppercase tracking-[0.2em] text-red-500/80 mt-1">Dashboard</span>
|
<span className="text-[9px] font-black uppercase tracking-[0.2em] text-primary/80 mt-1">by HexaHost</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="hidden lg:flex items-center gap-10 text-[11px] font-black uppercase tracking-widest text-slate-500">
|
<div className="hidden lg:flex items-center gap-10 text-[11px] font-black uppercase tracking-widest text-slate-500">
|
||||||
<Link href="#features" className="hover:text-red-500 transition-colors">Features</Link>
|
<Link href="#features" className="hover:text-primary transition-colors">Features</Link>
|
||||||
<Link href="#architecture" className="hover:text-red-500 transition-colors">Architecture</Link>
|
<Link href="#architecture" className="hover:text-primary transition-colors">Architecture</Link>
|
||||||
<Link href="#modules" className="hover:text-red-500 transition-colors">Modules</Link>
|
<Link href="#modules" className="hover:text-primary transition-colors">Modules</Link>
|
||||||
<Link href="#network" className="hover:text-red-500 transition-colors">Network</Link>
|
<Link href="#network" className="hover:text-primary transition-colors">Network</Link>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="flex items-center gap-4">
|
<div className="flex items-center gap-4">
|
||||||
<Button
|
<Button
|
||||||
onClick={() => signIn('discord', { callbackUrl: '/dashboard' })}
|
onClick={() => signIn('discord', { callbackUrl: '/dashboard' })}
|
||||||
className="rounded-xl px-7 h-11 font-black uppercase tracking-widest text-[10px] gap-2.5 shadow-2xl shadow-red-500/20 hover:scale-[1.05] active:scale-95 transition-all bg-gradient-to-r from-red-500 to-red-700 border-none"
|
className="rounded-xl px-7 h-11 font-black uppercase tracking-widest text-[10px] gap-2.5 shadow-2xl shadow-primary/20 hover:scale-[1.05] active:scale-95 transition-all bg-gradient-to-r from-primary to-accent border-none"
|
||||||
>
|
>
|
||||||
<LogIn className="h-3.5 w-3.5" />
|
<LogIn className="h-3.5 w-3.5" />
|
||||||
Initialize Console
|
Initialize Console
|
||||||
@@ -89,17 +88,17 @@ export default function LandingPage() {
|
|||||||
{/* Hero Section */}
|
{/* Hero Section */}
|
||||||
<header className="relative z-10 pt-56 pb-32 px-6">
|
<header className="relative z-10 pt-56 pb-32 px-6">
|
||||||
<div className="max-w-7xl mx-auto text-center">
|
<div className="max-w-7xl mx-auto text-center">
|
||||||
<div className="inline-flex items-center gap-3 px-6 py-2.5 rounded-2xl bg-red-500/[0.03] border border-red-500/10 text-red-500 text-[10px] font-black uppercase tracking-[0.3em] mb-16 animate-in fade-in slide-in-from-bottom-8 duration-1000 backdrop-blur-md">
|
<div className="inline-flex items-center gap-3 px-6 py-2.5 rounded-2xl bg-primary/[0.03] border border-primary/10 text-primary text-[10px] font-black uppercase tracking-[0.3em] mb-16 animate-in fade-in slide-in-from-bottom-8 duration-1000 backdrop-blur-md">
|
||||||
<span className="relative flex h-2 w-2">
|
<span className="relative flex h-2 w-2">
|
||||||
<span className="animate-ping absolute inline-flex h-full w-full rounded-full bg-red-500 opacity-75"></span>
|
<span className="animate-ping absolute inline-flex h-full w-full rounded-full bg-primary opacity-75"></span>
|
||||||
<span className="relative inline-flex rounded-full h-2 w-2 bg-red-600"></span>
|
<span className="relative inline-flex rounded-full h-2 w-2 bg-primary-hover"></span>
|
||||||
</span>
|
</span>
|
||||||
Neural Core v2 Active • Global Shard 07
|
Neural Core v2 Active • Global Shard 07
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<h1 className="text-6xl sm:text-8xl md:text-[10rem] font-bold text-white tracking-tighter leading-[0.8] mb-12 font-outfit animate-in fade-in slide-in-from-bottom-12 duration-1000 delay-100 uppercase">
|
<h1 className="text-6xl sm:text-8xl md:text-[10rem] font-bold text-white tracking-tighter leading-[0.8] mb-12 font-outfit animate-in fade-in slide-in-from-bottom-12 duration-1000 delay-100 uppercase">
|
||||||
Evolution <br />
|
Evolution <br />
|
||||||
<span className="bg-gradient-to-r from-red-500 via-red-400 to-orange-500 bg-clip-text text-transparent italic font-black">Moderated.</span>
|
<span className="bg-gradient-to-r from-primary via-red-400 to-orange-500 bg-clip-text text-transparent italic font-black">Moderated.</span>
|
||||||
</h1>
|
</h1>
|
||||||
|
|
||||||
<p className="text-lg md:text-2xl text-slate-500 max-w-3xl mx-auto leading-relaxed mb-20 animate-in fade-in slide-in-from-bottom-12 duration-1000 delay-200 font-medium">
|
<p className="text-lg md:text-2xl text-slate-500 max-w-3xl mx-auto leading-relaxed mb-20 animate-in fade-in slide-in-from-bottom-12 duration-1000 delay-200 font-medium">
|
||||||
@@ -110,7 +109,7 @@ export default function LandingPage() {
|
|||||||
<div className="flex flex-col sm:flex-row items-center justify-center gap-6 animate-in fade-in slide-in-from-bottom-12 duration-1000 delay-300">
|
<div className="flex flex-col sm:flex-row items-center justify-center gap-6 animate-in fade-in slide-in-from-bottom-12 duration-1000 delay-300">
|
||||||
<Button
|
<Button
|
||||||
onClick={() => signIn('discord', { callbackUrl: '/dashboard' })}
|
onClick={() => signIn('discord', { callbackUrl: '/dashboard' })}
|
||||||
className="w-full sm:w-auto rounded-2xl px-14 py-9 text-lg font-black uppercase gap-4 group shadow-[0_0_50px_rgba(239,68,68,0.2)] bg-red-600 text-white hover:bg-red-500 border-none transition-all hover:scale-105"
|
className="w-full sm:w-auto rounded-2xl px-14 py-9 text-lg font-black uppercase gap-4 group shadow-[0_0_50px_rgba(239,68,68,0.2)] bg-primary-hover text-white hover:bg-primary border-none transition-all hover:scale-105"
|
||||||
>
|
>
|
||||||
<LayoutDashboard className="h-6 w-6 group-hover:rotate-12 transition-transform" />
|
<LayoutDashboard className="h-6 w-6 group-hover:rotate-12 transition-transform" />
|
||||||
Open Dashboard
|
Open Dashboard
|
||||||
@@ -124,12 +123,12 @@ export default function LandingPage() {
|
|||||||
|
|
||||||
{/* Cinematic Dashboard Mockup */}
|
{/* Cinematic Dashboard Mockup */}
|
||||||
<div className="max-w-6xl mx-auto mt-40 relative group animate-in fade-in zoom-in-95 duration-1000 delay-500">
|
<div className="max-w-6xl mx-auto mt-40 relative group animate-in fade-in zoom-in-95 duration-1000 delay-500">
|
||||||
<div className="absolute -inset-4 bg-gradient-to-r from-red-500/20 to-transparent rounded-[60px] blur-3xl opacity-0 group-hover:opacity-100 transition-opacity duration-1000" />
|
<div className="absolute -inset-4 bg-gradient-to-r from-primary/20 to-transparent rounded-[60px] blur-3xl opacity-0 group-hover:opacity-100 transition-opacity duration-1000" />
|
||||||
<div className="relative bg-[#020617] border border-white/[0.05] rounded-[50px] overflow-hidden shadow-[0_30px_100px_rgba(0,0,0,0.8)]">
|
<div className="relative bg-[#0d0821] border border-white/[0.05] rounded-[50px] overflow-hidden shadow-[0_30px_100px_rgba(0,0,0,0.8)]">
|
||||||
{/* Fake Window Controls */}
|
{/* Fake Window Controls */}
|
||||||
<div className="h-16 border-b border-white/[0.03] flex items-center justify-between px-10 bg-white/[0.01]">
|
<div className="h-16 border-b border-white/[0.03] flex items-center justify-between px-10 bg-white/[0.01]">
|
||||||
<div className="flex items-center gap-3">
|
<div className="flex items-center gap-3">
|
||||||
<div className="h-3 w-3 rounded-full bg-red-500/40" />
|
<div className="h-3 w-3 rounded-full bg-primary/40" />
|
||||||
<div className="h-3 w-3 rounded-full bg-white/10" />
|
<div className="h-3 w-3 rounded-full bg-white/10" />
|
||||||
<div className="h-3 w-3 rounded-full bg-white/5" />
|
<div className="h-3 w-3 rounded-full bg-white/5" />
|
||||||
</div>
|
</div>
|
||||||
@@ -139,27 +138,27 @@ export default function LandingPage() {
|
|||||||
<div className="w-12" />
|
<div className="w-12" />
|
||||||
</div>
|
</div>
|
||||||
{/* Content Placeholder with High Contrast */}
|
{/* Content Placeholder with High Contrast */}
|
||||||
<div className="aspect-[16/10] p-16 flex flex-col gap-16 relative overflow-hidden bg-gradient-to-br from-[#020617] to-[#0a0f1e]">
|
<div className="aspect-[16/10] p-16 flex flex-col gap-16 relative overflow-hidden bg-gradient-to-br from-[#0d0821] to-[#1a1230]">
|
||||||
<div className="flex items-center justify-between z-10 relative">
|
<div className="flex items-center justify-between z-10 relative">
|
||||||
<div className="space-y-6">
|
<div className="space-y-6">
|
||||||
<div className="h-12 w-64 bg-red-500/10 rounded-[20px] border border-red-500/20" />
|
<div className="h-12 w-64 bg-primary/10 rounded-[20px] border border-primary/20" />
|
||||||
<div className="h-6 w-[500px] bg-white/[0.02] rounded-xl" />
|
<div className="h-6 w-[500px] bg-white/[0.02] rounded-xl" />
|
||||||
</div>
|
</div>
|
||||||
<div className="h-20 w-20 rounded-[30px] bg-red-500/10 border border-red-500/20 flex items-center justify-center shadow-[0_0_30px_rgba(239,68,68,0.2)]">
|
<div className="h-20 w-20 rounded-[30px] bg-primary/10 border border-primary/20 flex items-center justify-center shadow-[0_0_30px_rgba(239,68,68,0.2)]">
|
||||||
<Activity className="h-8 w-8 text-red-500 animate-pulse" />
|
<Activity className="h-8 w-8 text-primary animate-pulse" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="grid grid-cols-3 gap-10 z-10">
|
<div className="grid grid-cols-3 gap-10 z-10">
|
||||||
{[1, 2, 3].map(i => (
|
{[1, 2, 3].map(i => (
|
||||||
<div key={i} className="h-40 bg-white/[0.02] border border-white/[0.04] rounded-[40px] p-8 space-y-6 hover:border-red-500/20 transition-colors">
|
<div key={i} className="h-40 bg-white/[0.02] border border-white/[0.04] rounded-[40px] p-8 space-y-6 hover:border-primary/20 transition-colors">
|
||||||
<div className="h-10 w-10 rounded-2xl bg-red-500/10 border border-red-500/20" />
|
<div className="h-10 w-10 rounded-2xl bg-primary/10 border border-primary/20" />
|
||||||
<div className="h-4 w-2/3 bg-white/5 rounded-lg" />
|
<div className="h-4 w-2/3 bg-white/5 rounded-lg" />
|
||||||
<div className="h-3 w-1/2 bg-white/[0.02] rounded-lg" />
|
<div className="h-3 w-1/2 bg-white/[0.02] rounded-lg" />
|
||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
{/* Visual Glow Layer */}
|
{/* Visual Glow Layer */}
|
||||||
<div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[90%] h-[90%] bg-red-500/[0.02] blur-[150px] pointer-events-none" />
|
<div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[90%] h-[90%] bg-primary/[0.02] blur-[150px] pointer-events-none" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -170,13 +169,13 @@ export default function LandingPage() {
|
|||||||
<div className="max-w-7xl mx-auto">
|
<div className="max-w-7xl mx-auto">
|
||||||
<div className="flex flex-col md:flex-row md:items-end justify-between mb-32 gap-12 px-4">
|
<div className="flex flex-col md:flex-row md:items-end justify-between mb-32 gap-12 px-4">
|
||||||
<div className="max-w-3xl">
|
<div className="max-w-3xl">
|
||||||
<h2 className="text-6xl md:text-8xl font-bold text-white tracking-tighter font-outfit mb-8 uppercase italic leading-none">High-Scale <br /><span className="text-red-500 not-italic">Infrastructure.</span></h2>
|
<h2 className="text-6xl md:text-8xl font-bold text-white tracking-tighter font-outfit mb-8 uppercase italic leading-none">High-Scale <br /><span className="text-primary not-italic">Infrastructure.</span></h2>
|
||||||
<p className="text-2xl text-slate-500 font-medium leading-relaxed">Global redundancy delivers sub-millisecond dispatch times across 20+ edge regions. Zero lag, zero downtime.</p>
|
<p className="text-2xl text-slate-500 font-medium leading-relaxed">Global redundancy delivers sub-millisecond dispatch times across 20+ edge regions. Zero lag, zero downtime.</p>
|
||||||
</div>
|
</div>
|
||||||
<div className="flex items-center gap-10 pb-4">
|
<div className="flex items-center gap-10 pb-4">
|
||||||
<div className="text-right">
|
<div className="text-right">
|
||||||
<p className="text-[10px] font-black uppercase text-slate-600 tracking-[0.3em] mb-3">Ping Latency</p>
|
<p className="text-[10px] font-black uppercase text-slate-600 tracking-[0.3em] mb-3">Ping Latency</p>
|
||||||
<p className="text-5xl font-black text-red-500 font-outfit">12ms</p>
|
<p className="text-5xl font-black text-primary font-outfit">12ms</p>
|
||||||
</div>
|
</div>
|
||||||
<div className="h-16 w-[1px] bg-white/5" />
|
<div className="h-16 w-[1px] bg-white/5" />
|
||||||
<div className="text-right">
|
<div className="text-right">
|
||||||
@@ -192,7 +191,7 @@ export default function LandingPage() {
|
|||||||
title: "Neuro-Security",
|
title: "Neuro-Security",
|
||||||
desc: "Contextual AI analysis detects raids and token-logging attempts in real-time.",
|
desc: "Contextual AI analysis detects raids and token-logging attempts in real-time.",
|
||||||
icon: ShieldCheck,
|
icon: ShieldCheck,
|
||||||
color: "bg-red-500/10 border-red-500/20 text-red-500"
|
color: "bg-primary/10 border-primary/20 text-primary"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Edge Dispatch",
|
title: "Edge Dispatch",
|
||||||
@@ -204,7 +203,7 @@ export default function LandingPage() {
|
|||||||
title: "Leveling Engine",
|
title: "Leveling Engine",
|
||||||
desc: "Premium rendered rewards with 4K rank card generation and multi-role hierarchies.",
|
desc: "Premium rendered rewards with 4K rank card generation and multi-role hierarchies.",
|
||||||
icon: BarChart4,
|
icon: BarChart4,
|
||||||
color: "bg-red-600/10 border-red-600/20 text-red-600"
|
color: "bg-primary/10 border-primary/20 text-primary"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Threaded Support",
|
title: "Threaded Support",
|
||||||
@@ -216,7 +215,7 @@ export default function LandingPage() {
|
|||||||
title: "Real-time Flux",
|
title: "Real-time Flux",
|
||||||
desc: "Watch server events live with zero-latency WebSocket data streaming.",
|
desc: "Watch server events live with zero-latency WebSocket data streaming.",
|
||||||
icon: History,
|
icon: History,
|
||||||
color: "bg-red-800/10 border-red-800/20 text-red-700"
|
color: "bg-accent/10 border-accent/20 text-accent"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Cloud Integrity",
|
title: "Cloud Integrity",
|
||||||
@@ -225,7 +224,7 @@ export default function LandingPage() {
|
|||||||
color: "bg-white/10 border-white/20 text-white"
|
color: "bg-white/10 border-white/20 text-white"
|
||||||
}
|
}
|
||||||
].map((feature, i) => (
|
].map((feature, i) => (
|
||||||
<div key={i} className="group glass border-white/5 p-12 rounded-[50px] hover:border-red-500/30 transition-all duration-700 relative overflow-hidden">
|
<div key={i} className="group glass border-white/5 p-12 rounded-[50px] hover:border-primary/30 transition-all duration-700 relative overflow-hidden">
|
||||||
<div className="absolute top-0 right-0 p-12 opacity-0 group-hover:opacity-5 scale-50 group-hover:scale-110 transition-all duration-1000">
|
<div className="absolute top-0 right-0 p-12 opacity-0 group-hover:opacity-5 scale-50 group-hover:scale-110 transition-all duration-1000">
|
||||||
<feature.icon className="h-64 w-64 text-white" />
|
<feature.icon className="h-64 w-64 text-white" />
|
||||||
</div>
|
</div>
|
||||||
@@ -234,7 +233,7 @@ export default function LandingPage() {
|
|||||||
</div>
|
</div>
|
||||||
<h3 className="text-3xl font-bold text-white mb-6 tracking-tight font-outfit relative z-10">{feature.title}</h3>
|
<h3 className="text-3xl font-bold text-white mb-6 tracking-tight font-outfit relative z-10">{feature.title}</h3>
|
||||||
<p className="text-slate-500 leading-relaxed font-bold relative z-10 group-hover:text-slate-400 transition-colors uppercase text-[10px] tracking-[0.2em]">{feature.desc}</p>
|
<p className="text-slate-500 leading-relaxed font-bold relative z-10 group-hover:text-slate-400 transition-colors uppercase text-[10px] tracking-[0.2em]">{feature.desc}</p>
|
||||||
<div className="mt-8 h-[2px] w-0 bg-red-500 group-hover:w-full transition-all duration-700" />
|
<div className="mt-8 h-[2px] w-0 bg-primary group-hover:w-full transition-all duration-700" />
|
||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
@@ -245,7 +244,7 @@ export default function LandingPage() {
|
|||||||
<section id="architecture" className="py-48 px-6 bg-white/[0.01]">
|
<section id="architecture" className="py-48 px-6 bg-white/[0.01]">
|
||||||
<div className="max-w-7xl mx-auto grid grid-cols-1 lg:grid-cols-2 gap-24 items-center">
|
<div className="max-w-7xl mx-auto grid grid-cols-1 lg:grid-cols-2 gap-24 items-center">
|
||||||
<div className="space-y-12">
|
<div className="space-y-12">
|
||||||
<div className="inline-flex px-4 py-1.5 rounded-full bg-red-500/10 border border-red-500/20 text-red-500 text-[10px] font-black uppercase tracking-[0.3em]">
|
<div className="inline-flex px-4 py-1.5 rounded-full bg-primary/10 border border-primary/20 text-primary text-[10px] font-black uppercase tracking-[0.3em]">
|
||||||
The Stack
|
The Stack
|
||||||
</div>
|
</div>
|
||||||
<h2 className="text-6xl md:text-7xl font-bold text-white tracking-tighter font-outfit uppercase">Neural Core <br /><span className="text-slate-600 italic">Technology.</span></h2>
|
<h2 className="text-6xl md:text-7xl font-bold text-white tracking-tighter font-outfit uppercase">Neural Core <br /><span className="text-slate-600 italic">Technology.</span></h2>
|
||||||
@@ -260,7 +259,7 @@ export default function LandingPage() {
|
|||||||
{ icon: Radio, title: "Low Entropy", desc: "Optimized for minimal CPU jitter and maximum reliability." }
|
{ icon: Radio, title: "Low Entropy", desc: "Optimized for minimal CPU jitter and maximum reliability." }
|
||||||
].map((item, i) => (
|
].map((item, i) => (
|
||||||
<div key={i} className="space-y-4 p-6 rounded-[30px] border border-white/[0.03] hover:bg-white/[0.02] transition-colors">
|
<div key={i} className="space-y-4 p-6 rounded-[30px] border border-white/[0.03] hover:bg-white/[0.02] transition-colors">
|
||||||
<item.icon className="h-6 w-6 text-red-500" />
|
<item.icon className="h-6 w-6 text-primary" />
|
||||||
<h4 className="text-lg font-bold text-white font-outfit uppercase tracking-tight">{item.title}</h4>
|
<h4 className="text-lg font-bold text-white font-outfit uppercase tracking-tight">{item.title}</h4>
|
||||||
<p className="text-sm text-slate-600 font-bold leading-relaxed">{item.desc}</p>
|
<p className="text-sm text-slate-600 font-bold leading-relaxed">{item.desc}</p>
|
||||||
</div>
|
</div>
|
||||||
@@ -268,13 +267,13 @@ export default function LandingPage() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="relative aspect-square flex items-center justify-center group">
|
<div className="relative aspect-square flex items-center justify-center group">
|
||||||
<div className="absolute inset-0 bg-red-500/5 blur-[120px] rounded-full animate-pulse" />
|
<div className="absolute inset-0 bg-primary/5 blur-[120px] rounded-full animate-pulse" />
|
||||||
<div className="h-[80%] w-[80%] border-2 border-white/[0.05] rounded-full animate-[spin_60s_linear_infinite] flex items-center justify-center relative">
|
<div className="h-[80%] w-[80%] border-2 border-white/[0.05] rounded-full animate-[spin_60s_linear_infinite] flex items-center justify-center relative">
|
||||||
<div className="absolute top-0 left-1/2 -translate-x-1/2 h-4 w-4 rounded-full bg-red-500 shadow-[0_0_20px_rgba(239,68,68,0.5)]" />
|
<div className="absolute top-0 left-1/2 -translate-x-1/2 h-4 w-4 rounded-full bg-primary shadow-[0_0_20px_rgba(239,68,68,0.5)]" />
|
||||||
<div className="h-[70%] w-[70%] border border-white/[0.05] rounded-full animate-[spin_40s_linear_infinite_reverse] flex items-center justify-center">
|
<div className="h-[70%] w-[70%] border border-white/[0.05] rounded-full animate-[spin_40s_linear_infinite_reverse] flex items-center justify-center">
|
||||||
<div className="absolute bottom-0 left-1/2 -translate-x-1/2 h-3 w-3 rounded-full bg-white/20 shadow-[0_0_20px_rgba(255,255,255,0.2)]" />
|
<div className="absolute bottom-0 left-1/2 -translate-x-1/2 h-3 w-3 rounded-full bg-white/20 shadow-[0_0_20px_rgba(255,255,255,0.2)]" />
|
||||||
<div className="h-[60%] w-[60%] border border-white/[0.05] rounded-full animate-[spin_20s_linear_infinite] flex items-center justify-center">
|
<div className="h-[60%] w-[60%] border border-white/[0.05] rounded-full animate-[spin_20s_linear_infinite] flex items-center justify-center">
|
||||||
<Bot className="h-20 w-20 text-red-500/40 group-hover:text-red-500 transition-all duration-700 group-hover:scale-125" />
|
<Bot className="h-20 w-20 text-primary/40 group-hover:text-primary transition-all duration-700 group-hover:scale-125" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -286,7 +285,7 @@ export default function LandingPage() {
|
|||||||
<section id="modules" className="py-48 px-6">
|
<section id="modules" className="py-48 px-6">
|
||||||
<div className="max-w-7xl mx-auto">
|
<div className="max-w-7xl mx-auto">
|
||||||
<div className="text-center mb-32 space-y-6">
|
<div className="text-center mb-32 space-y-6">
|
||||||
<h2 className="text-6xl md:text-8xl font-bold text-white tracking-tighter font-outfit uppercase">The Matrix <br /><span className="bg-gradient-to-r from-red-600 to-red-400 bg-clip-text text-transparent italic">Complete.</span></h2>
|
<h2 className="text-6xl md:text-8xl font-bold text-white tracking-tighter font-outfit uppercase">The Matrix <br /><span className="bg-gradient-to-r from-primary to-[#f093ff] bg-clip-text text-transparent italic">Complete.</span></h2>
|
||||||
<p className="text-2xl text-slate-500 max-w-3xl mx-auto font-medium lowercase">Every module you need. Redefined for the modern era.</p>
|
<p className="text-2xl text-slate-500 max-w-3xl mx-auto font-medium lowercase">Every module you need. Redefined for the modern era.</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -305,9 +304,9 @@ export default function LandingPage() {
|
|||||||
{ name: "Tickets", desc: "Support at lightspeed.", icon: MessageSquare },
|
{ name: "Tickets", desc: "Support at lightspeed.", icon: MessageSquare },
|
||||||
{ name: "Join DM", desc: "Personalized welcomes.", icon: MessageSquare }
|
{ name: "Join DM", desc: "Personalized welcomes.", icon: MessageSquare }
|
||||||
].map((mod, i) => (
|
].map((mod, i) => (
|
||||||
<div key={i} className="group p-8 rounded-[40px] bg-white/[0.01] border border-white/[0.03] hover:bg-red-500/[0.02] hover:border-red-500/20 transition-all duration-500">
|
<div key={i} className="group p-8 rounded-[40px] bg-white/[0.01] border border-white/[0.03] hover:bg-primary/[0.02] hover:border-primary/20 transition-all duration-500">
|
||||||
<div className="h-14 w-14 rounded-2xl bg-white/[0.03] flex items-center justify-center mb-6 group-hover:bg-red-500/10 transition-colors">
|
<div className="h-14 w-14 rounded-2xl bg-white/[0.03] flex items-center justify-center mb-6 group-hover:bg-primary/10 transition-colors">
|
||||||
<mod.icon className="h-6 w-6 text-slate-600 group-hover:text-red-500 transition-colors" />
|
<mod.icon className="h-6 w-6 text-slate-600 group-hover:text-primary transition-colors" />
|
||||||
</div>
|
</div>
|
||||||
<h4 className="text-xl font-bold text-white font-outfit mb-2 tracking-tight">{mod.name}</h4>
|
<h4 className="text-xl font-bold text-white font-outfit mb-2 tracking-tight">{mod.name}</h4>
|
||||||
<p className="text-xs text-slate-600 font-bold uppercase tracking-widest">{mod.desc}</p>
|
<p className="text-xs text-slate-600 font-bold uppercase tracking-widest">{mod.desc}</p>
|
||||||
@@ -318,11 +317,11 @@ export default function LandingPage() {
|
|||||||
</section>
|
</section>
|
||||||
|
|
||||||
{/* Network / Global Section */}
|
{/* Network / Global Section */}
|
||||||
<section id="network" className="py-48 px-6 bg-red-600/[0.01] relative overflow-hidden">
|
<section id="network" className="py-48 px-6 bg-primary-hover/[0.01] relative overflow-hidden">
|
||||||
<div className="max-w-7xl mx-auto relative z-10">
|
<div className="max-w-7xl mx-auto relative z-10">
|
||||||
<div className="flex flex-col lg:flex-row items-center gap-24">
|
<div className="flex flex-col lg:flex-row items-center gap-24">
|
||||||
<div className="flex-1 space-y-12">
|
<div className="flex-1 space-y-12">
|
||||||
<h2 className="text-6xl md:text-8xl font-bold text-white tracking-tighter font-outfit uppercase">Global <br /><span className="text-red-500">Reach.</span></h2>
|
<h2 className="text-6xl md:text-8xl font-bold text-white tracking-tighter font-outfit uppercase">Global <br /><span className="text-primary">Reach.</span></h2>
|
||||||
<p className="text-2xl text-slate-500 leading-relaxed font-medium">
|
<p className="text-2xl text-slate-500 leading-relaxed font-medium">
|
||||||
Powering servers with over 12 million combined users. Our network spans every continent, bringing your community closer together.
|
Powering servers with over 12 million combined users. Our network spans every continent, bringing your community closer together.
|
||||||
</p>
|
</p>
|
||||||
@@ -335,20 +334,20 @@ export default function LandingPage() {
|
|||||||
<div key={i} className="flex items-center gap-8">
|
<div key={i} className="flex items-center gap-8">
|
||||||
<div className="text-5xl font-black text-white font-outfit">{item.stat}</div>
|
<div className="text-5xl font-black text-white font-outfit">{item.stat}</div>
|
||||||
<div className="h-[1px] flex-1 bg-white/5" />
|
<div className="h-[1px] flex-1 bg-white/5" />
|
||||||
<div className="text-[11px] font-black uppercase text-red-500 tracking-[0.3em]">{item.label}</div>
|
<div className="text-[11px] font-black uppercase text-primary tracking-[0.3em]">{item.label}</div>
|
||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="flex-1 relative group">
|
<div className="flex-1 relative group">
|
||||||
<div className="absolute inset-0 bg-red-500/10 blur-[150px] opacity-0 group-hover:opacity-100 transition-opacity duration-1000" />
|
<div className="absolute inset-0 bg-primary/10 blur-[150px] opacity-0 group-hover:opacity-100 transition-opacity duration-1000" />
|
||||||
<div className="aspect-square bg-[#020617] border border-white/[0.05] rounded-[60px] p-12 relative overflow-hidden flex items-center justify-center">
|
<div className="aspect-square bg-[#0d0821] border border-white/[0.05] rounded-[60px] p-12 relative overflow-hidden flex items-center justify-center">
|
||||||
<Globe className="h-64 w-64 text-red-500/10 animate-pulse" />
|
<Globe className="h-64 w-64 text-primary/10 animate-pulse" />
|
||||||
<div className="absolute inset-0 flex items-center justify-center">
|
<div className="absolute inset-0 flex items-center justify-center">
|
||||||
<div className="h-32 w-32 bg-red-500/20 blur-[60px] rounded-full" />
|
<div className="h-32 w-32 bg-primary/20 blur-[60px] rounded-full" />
|
||||||
</div>
|
</div>
|
||||||
<div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 space-y-12">
|
<div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 space-y-12">
|
||||||
<Bot className="h-20 w-20 text-red-500 shadow-[0_0_50px_rgba(239,68,68,0.5)] bg-[#020617] rounded-3xl p-4 border border-red-500/50" />
|
<Bot className="h-20 w-20 text-primary shadow-[0_0_50px_rgba(255,81,249,0.5)] bg-[#0d0821] rounded-3xl p-4 border border-primary/50" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -372,7 +371,7 @@ export default function LandingPage() {
|
|||||||
].map((item, i) => (
|
].map((item, i) => (
|
||||||
<div key={i} className="p-10 rounded-[40px] border border-white/[0.03] hover:border-white/10 transition-all bg-white/[0.01] group">
|
<div key={i} className="p-10 rounded-[40px] border border-white/[0.03] hover:border-white/10 transition-all bg-white/[0.01] group">
|
||||||
<h4 className="text-xl font-bold text-white mb-6 font-outfit uppercase tracking-tight flex items-center gap-4">
|
<h4 className="text-xl font-bold text-white mb-6 font-outfit uppercase tracking-tight flex items-center gap-4">
|
||||||
<div className="h-2 w-2 rounded-full bg-red-500 opacity-20 group-hover:opacity-100 transition-all" />
|
<div className="h-2 w-2 rounded-full bg-primary opacity-20 group-hover:opacity-100 transition-all" />
|
||||||
{item.q}
|
{item.q}
|
||||||
</h4>
|
</h4>
|
||||||
<p className="text-slate-500 font-bold leading-relaxed">{item.a}</p>
|
<p className="text-slate-500 font-bold leading-relaxed">{item.a}</p>
|
||||||
@@ -384,7 +383,7 @@ export default function LandingPage() {
|
|||||||
|
|
||||||
{/* CTA Section */}
|
{/* CTA Section */}
|
||||||
<section className="py-48 px-6">
|
<section className="py-48 px-6">
|
||||||
<div className="max-w-6xl mx-auto relative rounded-[80px] p-24 md:p-32 overflow-hidden bg-gradient-to-br from-red-600 to-red-900 text-center shadow-[0_40px_100px_rgba(0,0,0,0.6)]">
|
<div className="max-w-6xl mx-auto relative rounded-[80px] p-24 md:p-32 overflow-hidden bg-gradient-to-br from-primary to-[#6b2aff] text-center shadow-[0_40px_100px_rgba(0,0,0,0.6)]">
|
||||||
<div className="absolute inset-0 bg-[url('https://grainy-gradients.vercel.app/noise.svg')] opacity-20 mix-blend-overlay" />
|
<div className="absolute inset-0 bg-[url('https://grainy-gradients.vercel.app/noise.svg')] opacity-20 mix-blend-overlay" />
|
||||||
<div className="relative z-10">
|
<div className="relative z-10">
|
||||||
<h2 className="text-7xl md:text-[9rem] font-bold text-white tracking-tighter font-outfit mb-12 uppercase leading-[0.8] italic">Ready to <br />Evolve?</h2>
|
<h2 className="text-7xl md:text-[9rem] font-bold text-white tracking-tighter font-outfit mb-12 uppercase leading-[0.8] italic">Ready to <br />Evolve?</h2>
|
||||||
@@ -406,7 +405,7 @@ export default function LandingPage() {
|
|||||||
</section>
|
</section>
|
||||||
|
|
||||||
{/* Footer */}
|
{/* Footer */}
|
||||||
<footer className="py-32 border-t border-white/[0.03] bg-[#020617] relative z-20">
|
<footer className="py-32 border-t border-white/[0.03] bg-[#0d0821] relative z-20">
|
||||||
<div className="max-w-7xl mx-auto px-6">
|
<div className="max-w-7xl mx-auto px-6">
|
||||||
<div className="grid grid-cols-1 md:grid-cols-4 gap-20 mb-32">
|
<div className="grid grid-cols-1 md:grid-cols-4 gap-20 mb-32">
|
||||||
<div className="col-span-1 md:col-span-2 space-y-12">
|
<div className="col-span-1 md:col-span-2 space-y-12">
|
||||||
@@ -420,17 +419,17 @@ export default function LandingPage() {
|
|||||||
<div className="space-y-8">
|
<div className="space-y-8">
|
||||||
<h4 className="text-[10px] font-black uppercase tracking-[0.4em] text-white opacity-40">System</h4>
|
<h4 className="text-[10px] font-black uppercase tracking-[0.4em] text-white opacity-40">System</h4>
|
||||||
<ul className="space-y-5 text-[11px] font-black uppercase tracking-widest text-slate-500">
|
<ul className="space-y-5 text-[11px] font-black uppercase tracking-widest text-slate-500">
|
||||||
<li><Link href="#" className="hover:text-red-500 transition-colors">GitHub Repository</Link></li>
|
<li><Link href="#" className="hover:text-primary transition-colors">GitHub Repository</Link></li>
|
||||||
<li><Link href="/docs" className="hover:text-red-500 transition-colors">Documentation</Link></li>
|
<li><Link href="/docs" className="hover:text-primary transition-colors">Documentation</Link></li>
|
||||||
<li><Link href="#" className="hover:text-red-500 transition-colors">API References</Link></li>
|
<li><Link href="#" className="hover:text-primary transition-colors">API References</Link></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div className="space-y-8">
|
<div className="space-y-8">
|
||||||
<h4 className="text-[10px] font-black uppercase tracking-[0.4em] text-white opacity-40">Identity</h4>
|
<h4 className="text-[10px] font-black uppercase tracking-[0.4em] text-white opacity-40">Identity</h4>
|
||||||
<ul className="space-y-5 text-[11px] font-black uppercase tracking-widest text-slate-500">
|
<ul className="space-y-5 text-[11px] font-black uppercase tracking-widest text-slate-500">
|
||||||
<li><Link href="/privacy" className="hover:text-red-500 transition-colors">Privacy Shield</Link></li>
|
<li><Link href="/privacy" className="hover:text-primary transition-colors">Privacy Shield</Link></li>
|
||||||
<li><Link href="/terms" className="hover:text-red-500 transition-colors">Terms of Service</Link></li>
|
<li><Link href="/terms" className="hover:text-primary transition-colors">Terms of Service</Link></li>
|
||||||
<li><Link href="#" className="hover:text-red-500 transition-colors">Discord Server</Link></li>
|
<li><Link href="#" className="hover:text-primary transition-colors">Discord Server</Link></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -439,8 +438,8 @@ export default function LandingPage() {
|
|||||||
© 2026 HexaHost // Axiom // Advanced Neural Infrastructure.
|
© 2026 HexaHost // Axiom // Advanced Neural Infrastructure.
|
||||||
</p>
|
</p>
|
||||||
<div className="flex items-center gap-8">
|
<div className="flex items-center gap-8">
|
||||||
<div className="flex items-center gap-3 text-[10px] font-black text-red-500 uppercase tracking-[0.3em]">
|
<div className="flex items-center gap-3 text-[10px] font-black text-primary uppercase tracking-[0.3em]">
|
||||||
<div className="h-2 w-2 rounded-full bg-red-500 animate-pulse" />
|
<div className="h-2 w-2 rounded-full bg-primary animate-pulse" />
|
||||||
All Nodes Operational
|
All Nodes Operational
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -16,22 +16,21 @@
|
|||||||
|
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
import { Bot, ChevronLeft, ShieldCheck, Lock, Eye, FileText } from "lucide-react";
|
import { ChevronLeft, ShieldCheck, Lock, Eye, FileText } from "lucide-react";
|
||||||
import { Button } from "@/components/ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
|
import { BrandLogo } from "@/components/brand-logo";
|
||||||
|
|
||||||
export default function PrivacyPage() {
|
export default function PrivacyPage() {
|
||||||
return (
|
return (
|
||||||
<div className="min-h-screen bg-[#020617] text-slate-200 font-sans">
|
<div className="min-h-screen bg-[#0d0821] text-slate-200 font-sans">
|
||||||
{/* Background Decor */}
|
{/* Background Decor */}
|
||||||
<div className="fixed inset-0 overflow-hidden pointer-events-none z-0">
|
<div className="fixed inset-0 overflow-hidden pointer-events-none z-0">
|
||||||
<div className="absolute top-[-10%] right-[-5%] w-[40%] h-[40%] bg-red-500/[0.03] blur-[120px] rounded-full" />
|
<div className="absolute top-[-10%] right-[-5%] w-[40%] h-[40%] bg-primary/[0.03] blur-[120px] rounded-full" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<nav className="fixed top-0 w-full z-50 border-b border-white/[0.03] bg-[#020617]/80 backdrop-blur-3xl px-6 h-20 flex items-center justify-between">
|
<nav className="fixed top-0 w-full z-50 border-b border-white/[0.03] bg-[#0d0821]/80 backdrop-blur-3xl px-6 h-20 flex items-center justify-between">
|
||||||
<Link href="/" className="flex items-center gap-4 group">
|
<Link href="/" className="flex items-center gap-4 group">
|
||||||
<div className="h-9 w-9 rounded-xl bg-red-600 flex items-center justify-center mr-4">
|
<BrandLogo size={36} className="group-hover:scale-110 transition-transform" />
|
||||||
<Bot className="h-5 w-5 text-white" />
|
|
||||||
</div>
|
|
||||||
<span className="text-xl font-bold text-white font-outfit uppercase tracking-tighter">Axiom Engine</span>
|
<span className="text-xl font-bold text-white font-outfit uppercase tracking-tighter">Axiom Engine</span>
|
||||||
</Link>
|
</Link>
|
||||||
<Link href="/">
|
<Link href="/">
|
||||||
@@ -44,19 +43,19 @@ export default function PrivacyPage() {
|
|||||||
|
|
||||||
<main className="relative z-10 pt-40 pb-32 px-6">
|
<main className="relative z-10 pt-40 pb-32 px-6">
|
||||||
<div className="max-w-4xl mx-auto">
|
<div className="max-w-4xl mx-auto">
|
||||||
<div className="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-red-500/10 border border-red-500/20 text-red-500 text-[10px] font-black uppercase tracking-widest mb-8">
|
<div className="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-primary/10 border border-primary/20 text-primary text-[10px] font-black uppercase tracking-widest mb-8">
|
||||||
<ShieldCheck className="h-3 w-3" />
|
<ShieldCheck className="h-3 w-3" />
|
||||||
Privacy Shield v2.0
|
Privacy Shield v2.0
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<h1 className="text-5xl md:text-7xl font-bold text-white font-outfit tracking-tighter uppercase mb-12 italic">
|
<h1 className="text-5xl md:text-7xl font-bold text-white font-outfit tracking-tighter uppercase mb-12 italic">
|
||||||
Privacy <span className="text-red-500 not-italic">Policy.</span>
|
Privacy <span className="text-primary not-italic">Policy.</span>
|
||||||
</h1>
|
</h1>
|
||||||
|
|
||||||
<div className="glass border-white/5 rounded-[40px] p-10 md:p-16 space-y-12">
|
<div className="glass border-white/5 rounded-[40px] p-10 md:p-16 space-y-12">
|
||||||
<section className="space-y-6">
|
<section className="space-y-6">
|
||||||
<div className="flex items-center gap-4 text-white">
|
<div className="flex items-center gap-4 text-white">
|
||||||
<div className="h-10 w-10 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-center text-red-500">
|
<div className="h-10 w-10 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-center text-primary">
|
||||||
<Eye className="h-5 w-5" />
|
<Eye className="h-5 w-5" />
|
||||||
</div>
|
</div>
|
||||||
<h2 className="text-2xl font-bold font-outfit uppercase tracking-tight">Data Collection</h2>
|
<h2 className="text-2xl font-bold font-outfit uppercase tracking-tight">Data Collection</h2>
|
||||||
@@ -68,7 +67,7 @@ export default function PrivacyPage() {
|
|||||||
|
|
||||||
<section className="space-y-6">
|
<section className="space-y-6">
|
||||||
<div className="flex items-center gap-4 text-white">
|
<div className="flex items-center gap-4 text-white">
|
||||||
<div className="h-10 w-10 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-center text-red-500">
|
<div className="h-10 w-10 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-center text-primary">
|
||||||
<Lock className="h-5 w-5" />
|
<Lock className="h-5 w-5" />
|
||||||
</div>
|
</div>
|
||||||
<h2 className="text-2xl font-bold font-outfit uppercase tracking-tight">Data Integrity</h2>
|
<h2 className="text-2xl font-bold font-outfit uppercase tracking-tight">Data Integrity</h2>
|
||||||
@@ -80,7 +79,7 @@ export default function PrivacyPage() {
|
|||||||
|
|
||||||
<section className="space-y-6">
|
<section className="space-y-6">
|
||||||
<div className="flex items-center gap-4 text-white">
|
<div className="flex items-center gap-4 text-white">
|
||||||
<div className="h-10 w-10 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-center text-red-500">
|
<div className="h-10 w-10 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-center text-primary">
|
||||||
<FileText className="h-5 w-5" />
|
<FileText className="h-5 w-5" />
|
||||||
</div>
|
</div>
|
||||||
<h2 className="text-2xl font-bold font-outfit uppercase tracking-tight">User Rights</h2>
|
<h2 className="text-2xl font-bold font-outfit uppercase tracking-tight">User Rights</h2>
|
||||||
|
|||||||
@@ -16,22 +16,21 @@
|
|||||||
|
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
import { Bot, ChevronLeft, Scale, Terminal, ShieldAlert, Cpu } from "lucide-react";
|
import { ChevronLeft, Scale, Terminal, ShieldAlert, Cpu } from "lucide-react";
|
||||||
import { Button } from "@/components/ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
|
import { BrandLogo } from "@/components/brand-logo";
|
||||||
|
|
||||||
export default function TermsPage() {
|
export default function TermsPage() {
|
||||||
return (
|
return (
|
||||||
<div className="min-h-screen bg-[#020617] text-slate-200 font-sans">
|
<div className="min-h-screen bg-[#0d0821] text-slate-200 font-sans">
|
||||||
{/* Background Decor */}
|
{/* Background Decor */}
|
||||||
<div className="fixed inset-0 overflow-hidden pointer-events-none z-0">
|
<div className="fixed inset-0 overflow-hidden pointer-events-none z-0">
|
||||||
<div className="absolute bottom-[-10%] left-[-5%] w-[40%] h-[40%] bg-red-600/[0.03] blur-[120px] rounded-full" />
|
<div className="absolute bottom-[-10%] left-[-5%] w-[40%] h-[40%] bg-accent/[0.05] blur-[120px] rounded-full" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<nav className="fixed top-0 w-full z-50 border-b border-white/[0.03] bg-[#020617]/80 backdrop-blur-3xl px-6 h-20 flex items-center justify-between">
|
<nav className="fixed top-0 w-full z-50 border-b border-white/[0.03] bg-[#0d0821]/80 backdrop-blur-3xl px-6 h-20 flex items-center justify-between">
|
||||||
<Link href="/" className="flex items-center gap-4 group">
|
<Link href="/" className="flex items-center gap-4 group">
|
||||||
<div className="h-10 w-10 rounded-xl bg-red-600 flex items-center justify-center group-hover:rotate-12 transition-transform">
|
<BrandLogo size={40} className="group-hover:rotate-12 transition-transform" />
|
||||||
<Bot className="h-5 w-5 text-white" />
|
|
||||||
</div>
|
|
||||||
<span className="text-xl font-bold text-white font-outfit uppercase tracking-tighter">{process.env.NEXT_PUBLIC_BRAND_NAME || "Axiom"} Engine</span>
|
<span className="text-xl font-bold text-white font-outfit uppercase tracking-tighter">{process.env.NEXT_PUBLIC_BRAND_NAME || "Axiom"} Engine</span>
|
||||||
</Link>
|
</Link>
|
||||||
<Link href="/">
|
<Link href="/">
|
||||||
@@ -44,19 +43,19 @@ export default function TermsPage() {
|
|||||||
|
|
||||||
<main className="relative z-10 pt-40 pb-32 px-6">
|
<main className="relative z-10 pt-40 pb-32 px-6">
|
||||||
<div className="max-w-4xl mx-auto">
|
<div className="max-w-4xl mx-auto">
|
||||||
<div className="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-red-500/10 border border-red-500/20 text-red-500 text-[10px] font-black uppercase tracking-widest mb-8">
|
<div className="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-primary/10 border border-primary/20 text-primary text-[10px] font-black uppercase tracking-widest mb-8">
|
||||||
<Scale className="h-3 w-3" />
|
<Scale className="h-3 w-3" />
|
||||||
Neural Protocol v2.4
|
Neural Protocol v2.4
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<h1 className="text-5xl md:text-7xl font-bold text-white font-outfit tracking-tighter uppercase mb-12 italic text-right">
|
<h1 className="text-5xl md:text-7xl font-bold text-white font-outfit tracking-tighter uppercase mb-12 italic text-right">
|
||||||
Terms of <span className="text-red-500 not-italic">Service.</span>
|
Terms of <span className="text-primary not-italic">Service.</span>
|
||||||
</h1>
|
</h1>
|
||||||
|
|
||||||
<div className="glass border-white/5 rounded-[40px] p-10 md:p-16 space-y-12 bg-gradient-to-br from-white/[0.01] to-transparent">
|
<div className="glass border-white/5 rounded-[40px] p-10 md:p-16 space-y-12 bg-gradient-to-br from-white/[0.01] to-transparent">
|
||||||
<section className="space-y-6">
|
<section className="space-y-6">
|
||||||
<div className="flex items-center gap-4 text-white">
|
<div className="flex items-center gap-4 text-white">
|
||||||
<div className="h-10 w-10 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-center text-red-500">
|
<div className="h-10 w-10 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-center text-primary">
|
||||||
<Terminal className="h-5 w-5" />
|
<Terminal className="h-5 w-5" />
|
||||||
</div>
|
</div>
|
||||||
<h2 className="text-2xl font-bold font-outfit uppercase tracking-tight">Acceptance of Protocol</h2>
|
<h2 className="text-2xl font-bold font-outfit uppercase tracking-tight">Acceptance of Protocol</h2>
|
||||||
@@ -68,7 +67,7 @@ export default function TermsPage() {
|
|||||||
|
|
||||||
<section className="space-y-6">
|
<section className="space-y-6">
|
||||||
<div className="flex items-center gap-4 text-white">
|
<div className="flex items-center gap-4 text-white">
|
||||||
<div className="h-10 w-10 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-center text-red-500">
|
<div className="h-10 w-10 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-center text-primary">
|
||||||
<ShieldAlert className="h-5 w-5" />
|
<ShieldAlert className="h-5 w-5" />
|
||||||
</div>
|
</div>
|
||||||
<h2 className="text-2xl font-bold font-outfit uppercase tracking-tight">Usage Constraints</h2>
|
<h2 className="text-2xl font-bold font-outfit uppercase tracking-tight">Usage Constraints</h2>
|
||||||
@@ -80,7 +79,7 @@ export default function TermsPage() {
|
|||||||
|
|
||||||
<section className="space-y-6">
|
<section className="space-y-6">
|
||||||
<div className="flex items-center gap-4 text-white">
|
<div className="flex items-center gap-4 text-white">
|
||||||
<div className="h-10 w-10 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-center text-red-500">
|
<div className="h-10 w-10 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-center text-primary">
|
||||||
<Cpu className="h-5 w-5" />
|
<Cpu className="h-5 w-5" />
|
||||||
</div>
|
</div>
|
||||||
<h2 className="text-2xl font-bold font-outfit uppercase tracking-tight">API & Scaling</h2>
|
<h2 className="text-2xl font-bold font-outfit uppercase tracking-tight">API & Scaling</h2>
|
||||||
|
|||||||
36
dashboard/components/brand-logo.tsx
Normal file
@@ -0,0 +1,36 @@
|
|||||||
|
/**
|
||||||
|
* ╔══════════════════════════════════════════════════════════════════╗
|
||||||
|
* ║ ║
|
||||||
|
* ║ +-+-+-+-+-+-+-+-+ ║
|
||||||
|
* ║ |H|e|x|a|H|o|s|t| ║
|
||||||
|
* ║ +-+-+-+-+-+-+-+-+ ║
|
||||||
|
* ║ ║
|
||||||
|
* ║ © 2026 HexaHost — All Rights Reserved ║
|
||||||
|
* ║ ║
|
||||||
|
* ║ discord ── https://discord.gg/hexahost ║
|
||||||
|
* ║ github ── https://github.com/theoneandonlymace ║
|
||||||
|
* ║ ║
|
||||||
|
* ╚══════════════════════════════════════════════════════════════════╝
|
||||||
|
*/
|
||||||
|
import Image from "next/image";
|
||||||
|
import { cn } from "@/lib/utils";
|
||||||
|
|
||||||
|
type BrandLogoProps = {
|
||||||
|
className?: string;
|
||||||
|
size?: number;
|
||||||
|
priority?: boolean;
|
||||||
|
};
|
||||||
|
|
||||||
|
export function BrandLogo({ className, size = 40, priority = false }: BrandLogoProps) {
|
||||||
|
return (
|
||||||
|
<Image
|
||||||
|
src="/logo.svg"
|
||||||
|
alt={process.env.NEXT_PUBLIC_BRAND_NAME || "Axiom"}
|
||||||
|
width={size}
|
||||||
|
height={size}
|
||||||
|
priority={priority}
|
||||||
|
unoptimized
|
||||||
|
className={cn("shrink-0 select-none", className)}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
}
|
||||||
BIN
dashboard/public/apple-touch-icon.png
Normal file
|
After Width: | Height: | Size: 3.2 KiB |
BIN
dashboard/public/favicon-32.png
Normal file
|
After Width: | Height: | Size: 607 B |
BIN
dashboard/public/favicon.ico
Normal file
|
After Width: | Height: | Size: 385 B |
11
dashboard/public/favicon.svg
Normal file
@@ -0,0 +1,11 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
|
||||||
|
<defs>
|
||||||
|
<linearGradient id="g" x1="0%" y1="0%" x2="100%" y2="100%">
|
||||||
|
<stop offset="0%" stop-color="#ff51f9"/>
|
||||||
|
<stop offset="100%" stop-color="#a348ff"/>
|
||||||
|
</linearGradient>
|
||||||
|
</defs>
|
||||||
|
<polygon points="32,4 56,18 56,46 32,60 8,46 8,18" fill="url(#g)" stroke="#3978ff" stroke-width="2" stroke-linejoin="round"/>
|
||||||
|
<path d="M32 16 L45 48 H39.2 L36 39 H28 L24.8 48 H19 Z M27.2 35 H36.8 L32 23 Z" fill="#fff"/>
|
||||||
|
<rect x="26.5" y="34" width="11" height="2.5" rx="1" fill="#00cfff"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 565 B |
BIN
dashboard/public/logo.png
Normal file
|
After Width: | Height: | Size: 9.8 KiB |
42
dashboard/public/logo.svg
Normal file
@@ -0,0 +1,42 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128" role="img" aria-label="Axiom">
|
||||||
|
<defs>
|
||||||
|
<linearGradient id="axiomGrad" x1="0%" y1="0%" x2="100%" y2="100%">
|
||||||
|
<stop offset="0%" stop-color="#ff51f9"/>
|
||||||
|
<stop offset="55%" stop-color="#a348ff"/>
|
||||||
|
<stop offset="100%" stop-color="#3978ff"/>
|
||||||
|
</linearGradient>
|
||||||
|
<linearGradient id="axiomSheen" x1="0%" y1="0%" x2="0%" y2="100%">
|
||||||
|
<stop offset="0%" stop-color="#ffffff" stop-opacity="0.22"/>
|
||||||
|
<stop offset="45%" stop-color="#ffffff" stop-opacity="0"/>
|
||||||
|
</linearGradient>
|
||||||
|
<filter id="softGlow" x="-20%" y="-20%" width="140%" height="140%">
|
||||||
|
<feGaussianBlur stdDeviation="2.5" result="blur"/>
|
||||||
|
<feMerge>
|
||||||
|
<feMergeNode in="blur"/>
|
||||||
|
<feMergeNode in="SourceGraphic"/>
|
||||||
|
</feMerge>
|
||||||
|
</filter>
|
||||||
|
</defs>
|
||||||
|
|
||||||
|
<!-- Hexagon HexaHost DNA -->
|
||||||
|
<polygon
|
||||||
|
points="64,8 112,36 112,92 64,120 16,92 16,36"
|
||||||
|
fill="url(#axiomGrad)"
|
||||||
|
stroke="#00cfff"
|
||||||
|
stroke-width="2.5"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
filter="url(#softGlow)"
|
||||||
|
/>
|
||||||
|
<polygon
|
||||||
|
points="64,8 112,36 112,92 64,120 16,92 16,36"
|
||||||
|
fill="url(#axiomSheen)"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!-- Stylized A for Axiom -->
|
||||||
|
<path
|
||||||
|
d="M64 34 L88 94 H77.2 L71.4 78 H56.6 L50.8 94 H40 Z M59.2 70 H68.8 L64 56 Z"
|
||||||
|
fill="#ffffff"
|
||||||
|
/>
|
||||||
|
<!-- Crossbar accent in neon -->
|
||||||
|
<rect x="54" y="68" width="20" height="4.5" rx="1.5" fill="#00cfff"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.4 KiB |
@@ -26,23 +26,28 @@ const config: Config = {
|
|||||||
background: "var(--background)",
|
background: "var(--background)",
|
||||||
foreground: "var(--foreground)",
|
foreground: "var(--foreground)",
|
||||||
primary: {
|
primary: {
|
||||||
DEFAULT: "#ef4444", // Vivid Red
|
DEFAULT: "#ff51f9", // HexaHost magenta
|
||||||
hover: "#dc2626",
|
hover: "#c31adf",
|
||||||
glow: "rgba(239, 68, 68, 0.5)",
|
glow: "rgba(255, 81, 249, 0.45)",
|
||||||
},
|
},
|
||||||
secondary: {
|
secondary: {
|
||||||
DEFAULT: "#020617", // Deep Navy/Black
|
DEFAULT: "#0d0821", // HexaHost deep purple
|
||||||
light: "#0f172a",
|
light: "#1a1230",
|
||||||
},
|
},
|
||||||
accent: {
|
accent: {
|
||||||
red: "rgba(239, 68, 68, 0.1)",
|
DEFAULT: "#a348ff",
|
||||||
glass: "rgba(255, 255, 255, 0.03)",
|
blue: "#3978ff",
|
||||||
|
neon: "#00cfff",
|
||||||
|
red: "rgba(255, 81, 249, 0.12)",
|
||||||
|
glass: "rgba(255, 255, 255, 0.05)",
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
backgroundImage: {
|
backgroundImage: {
|
||||||
"gradient-radial": "radial-gradient(var(--tw-gradient-stops))",
|
"gradient-radial": "radial-gradient(var(--tw-gradient-stops))",
|
||||||
"gradient-conic":
|
"gradient-conic":
|
||||||
"conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))",
|
"conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))",
|
||||||
|
"hexa-primary": "linear-gradient(135deg, #ff51f9 0%, #a348ff 100%)",
|
||||||
|
"hexa-neon": "linear-gradient(135deg, #00cfff 0%, #ff51f9 100%)",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|||||||