76 lines
2.7 KiB
TypeScript
76 lines
2.7 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">
|
|
<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://openwheels.racing" className="hover:text-white transition-colors">
|
|
WEBSITE
|
|
</a>
|
|
<a
|
|
href="https://discord.gg/nvuB8EvT9P"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="inline-block px-8 py-3 border border-white/20 hover:border-white hover:bg-white/5 transition-all text-sm font-medium tracking-wider"
|
|
>
|
|
JOIN OUR DISCORD
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</footer >
|
|
);
|
|
}
|