banatie-service/apps/landing/src/app/layout.tsx

81 lines
2.6 KiB
TypeScript

import type { Metadata } from 'next';
import { Inter, Caveat } from 'next/font/google';
import Image from 'next/image';
import Script from 'next/script';
import { Footer } from '@/components/shared/Footer';
import banatieLogo from './_assets/banatie-logo-horisontal.png';
import './globals.css';
const inter = Inter({
variable: '--font-inter',
subsets: ['latin'],
display: 'swap',
});
const caveat = Caveat({
variable: '--font-caveat',
subsets: ['latin'],
weight: ['500', '600', '700'],
display: 'swap',
});
export const metadata: Metadata = {
metadataBase: new URL('https://banatie.app'),
};
export default function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
return (
<html lang="en" className="scroll-smooth">
<head>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossOrigin="anonymous" />
</head>
<Script
src="https://cloud.umami.is/script.js"
data-website-id="5af6a122-ca2e-4a48-9bfd-9cfd4d7b5174"
strategy="afterInteractive"
/>
<body className={`${inter.variable} ${caveat.variable} antialiased`}>
<div className="min-h-screen bg-gradient-to-br from-slate-950 via-slate-900 to-slate-950">
{/* Animated gradient background */}
<div className="fixed inset-0 overflow-hidden pointer-events-none">
<div className="absolute top-1/4 -left-1/4 w-96 h-96 bg-purple-600/10 rounded-full blur-3xl animate-pulse"></div>
<div className="absolute bottom-1/4 -right-1/4 w-96 h-96 bg-cyan-600/10 rounded-full blur-3xl animate-pulse delay-700"></div>
</div>
{/* Header */}
<header className="relative z-10 border-b border-white/10 backdrop-blur-sm">
<nav className="max-w-7xl mx-auto px-6 py-3 flex justify-between items-center h-16">
<div className="h-full flex items-center">
<Image
src={banatieLogo}
alt="Banatie Logo"
width={150}
height={40}
priority
className="h-full w-auto object-contain"
/>
</div>
<a
href="#get-access"
className="text-sm text-gray-300 hover:text-white transition-colors"
>
Get Access
</a>
</nav>
</header>
{/* Page content */}
{children}
<Footer />
</div>
</body>
</html>
);
}