completionId: cgen-dc255a440d9d41c382a5d51b115e3d1e

cgen-dc255a440d9d41c382a5d51b115e3d1e
This commit is contained in:
Builder.io 2025-11-10 19:48:44 +00:00
parent d1744d70c2
commit 5fffc13a80

View file

@ -133,12 +133,11 @@ export default function CodeLayout({ children, hideFooter }: LayoutProps) {
<div className="min-h-screen bg-aethex-gradient">
<header className="sticky top-0 z-50 border-b border-border/40 bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60 animate-slide-down">
<div className="container mx-auto max-w-7xl flex min-h-16 h-auto items-center justify-between px-4 py-2 gap-2 min-w-0">
{/* Logo - Desktop: Link, Mobile: Expandable Arms */}
<div className="flex items-center shrink-0 relative">
{/* Desktop Logo */}
{/* Logo */}
<div className="flex items-center shrink-0">
<Link
to="/"
className="hover-glow group inline-block hidden sm:block"
className="hover-glow group inline-block"
>
<img
src="https://docs.aethex.tech/~gitbook/image?url=https%3A%2F%2F1143808467-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Forganizations%252FDhUg3jal6kdpG645FzIl%252Fsites%252Fsite_HeOmR%252Flogo%252FqxDYz8Oj2SnwUTa8t3UB%252FAeThex%2520Origin%2520logo.png%3Falt%3Dmedia%26token%3D200e8ea2-0129-4cbe-b516-4a53f60c512b&width=256&dpr=1&quality=100&sign=6c7576ce&sv=2"
@ -146,74 +145,6 @@ export default function CodeLayout({ children, hideFooter }: LayoutProps) {
className="h-10 w-10 transition-all duration-300 group-hover:scale-110 group-hover:rotate-12"
/>
</Link>
{/* Mobile Logo - Expandable Arms */}
<button
type="button"
onClick={() => setMobileArmsOpen(!mobileArmsOpen)}
className={`sm:hidden relative h-12 w-12 flex items-center justify-center rounded-xl transition-all duration-300 cursor-pointer ${
mobileArmsOpen
? "bg-gradient-to-r from-yellow-500/30 via-green-500/30 to-blue-500/30 scale-110 shadow-lg shadow-purple-500/30"
: "bg-gray-700/40 hover:bg-gray-600/60 shadow-lg"
}`}
title="Toggle Arms"
>
<div
className={`absolute inset-0 rounded-xl border-2 transition-all duration-300 ${
mobileArmsOpen
? "border-purple-400/80 animate-spin"
: "border-gray-600/40"
}`}
style={{
animation: mobileArmsOpen
? "spin 3s linear infinite"
: "none",
}}
/>
<img
src="https://docs.aethex.tech/~gitbook/image?url=https%3A%2F%2F1143808467-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Forganizations%252FDhUg3jal6kdpG645FzIl%252Fsites%252Fsite_HeOmR%252Flogo%252FqxDYz8Oj2SnwUTa8t3UB%252FAeThex%2520Origin%2520logo.png%3Falt%3Dmedia%26token%3D200e8ea2-0129-4cbe-b516-4a53f60c512b&width=256&dpr=1&quality=100&sign=6c7576ce&sv=2"
alt="AeThex Logo"
className={`relative h-9 w-9 transition-all duration-300 ${
mobileArmsOpen ? "rotate-180 scale-85" : "rotate-0"
}`}
/>
</button>
{/* Mobile Arms Dropdown */}
{mobileArmsOpen && (
<>
{/* Backdrop */}
<div
className="fixed inset-0 z-40 bg-black/40 backdrop-blur-sm sm:hidden"
onClick={() => setMobileArmsOpen(false)}
/>
{/* Arms Menu */}
<div className="absolute top-full left-0 mt-2 z-50 bg-gray-900/95 backdrop-blur-xl border border-gray-700/50 rounded-xl p-3 w-64 shadow-2xl animate-in fade-in zoom-in-95 sm:hidden">
<div className="grid grid-cols-1 gap-2">
{ARMS.map((arm) => (
<button
key={arm.id}
onClick={() => {
navigate(arm.href);
setMobileArmsOpen(false);
}}
className="flex items-center gap-2 p-2 rounded-lg transition-all duration-200 hover:bg-gray-700/50 hover:scale-105"
>
<img
src={ARM_LOGOS[arm.id]}
alt={arm.label}
className="h-6 w-6 object-contain"
/>
<span className="text-sm font-semibold text-white">
{arm.label}
</span>
</button>
))}
</div>
</div>
</>
)}
</div>
{/* Navigation */}