ACPlayer_Webpage/app/layout.tsx

76 lines
2.2 KiB
TypeScript

// app/layout.tsx
// Root layout with navbar and footer (like Laravel layouts!)
import type { Metadata } from "next";
import Navbar from "@/components/navbar";
import InteractiveTopo from "@/components/interactiveTopo";
import "./globals.css";
export const metadata: Metadata = {
title: "OpenWheels Racing",
description: "Free racing community - Live dashboard and rankings",
};
export default function RootLayout({
children,
}: {
children: React.ReactNode;
}) {
return (
<html lang="en">
<body>
<div className="min-h-screen bg-[#0a0a0a] flex flex-col relative">
{/* Interactive topology effect */}
<InteractiveTopo />
{/* Static topology background */}
<div className="fixed inset-0 topo-lines pointer-events-none z-0" />
{/* Content wrapper */}
<div className="relative z-10 flex flex-col min-h-screen">
{/* Navbar - appears on all pages */}
<Navbar />
{/* Page content */}
<main className="flex-1">
{children}
</main>
{/* Footer - appears on all pages */}
<Footer />
</div>
</div>
</body>
</html>
);
}
function Footer() {
return (
<footer className="border-t border-white/10 mt-20">
<div className="max-w-7xl mx-auto px-6 py-8">
<div className="flex items-center justify-between text-sm">
<div className="flex items-center space-x-3">
<img
src="https://openwheels.racing/files/img/Openwheels_small.svg"
alt="OW"
className="h-6 w-6 brightness-0 invert opacity-50"
/>
<span className="text-white/40 tracking-wider">
© 2025 OPENWHEELS.RACING
</span>
</div>
<div className="flex items-center space-x-6 text-white/40">
<a href="https://discord.gg/nvuB8EvT9P" className="hover:text-white transition-colors">
DISCORD
</a>
<a href="https://openwheels.racing" className="hover:text-white transition-colors">
WEBSITE
</a>
</div>
</div>
</div>
</footer>
);
}