File size: 2,296 Bytes
c92b696
94c9882
 
 
 
c92b696
02e775b
 
4d91720
bea55e2
 
94c9882
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
c92b696
 
 
 
 
 
bea55e2
c92b696
 
94c9882
 
 
 
 
 
bea55e2
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
94c9882
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
import type { Metadata, Viewport } from "next";
import { Plus_Jakarta_Sans, Sora } from "next/font/google";
import "./globals.css";
import { Toaster } from "@/components/ui/toaster";
import { AuthProvider } from "@/components/auth-provider";
import { OTABootstrap } from "@/components/ota-bootstrap";
import { OptimisticUIProvider } from "@/components/optimistic-ui";
import { GlobalSpotlight } from "@/components/global-spotlight";
import { NavShell } from "@/components/nav-shell";
import { NativeBackGesture } from "@/components/native-back-gesture";
import RealisticSmoke from "@/components/RealisticSmoke";

const jakarta = Plus_Jakarta_Sans({
  variable: "--font-geist-sans",
  subsets: ["latin"],
  weight: ["400", "500", "600", "700", "800"],
});

const sora = Sora({
  variable: "--font-geist-mono",
  subsets: ["latin"],
  weight: ["600", "700", "800"],
});

export const metadata: Metadata = {
  title: "Cellex — Nigeria's #1 Marketplace",
  description: "Shop electronics, fashion, home goods and more. Social ecommerce with live shopping, group buys, and AI-powered discovery.",
  keywords: ["Cellex", "Nigeria", "marketplace", "ecommerce", "online shopping"],
  icons: {
    icon: "/favicon.ico",
  },
};

export const viewport: Viewport = {
  width: "device-width",
  initialScale: 1,
  maximumScale: 1,
  userScalable: false,
  viewportFit: "cover",
  themeColor: "#050508",
};

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) {
  return (
    <html lang="en" suppressHydrationWarning className="m-0 p-0 overflow-x-hidden">
      <body className={`${jakarta.variable} ${sora.variable} antialiased min-h-screen relative text-slate-100 bg-[#050508]`}>
        {/* Background Layer */}
        <RealisticSmoke />
        
        {/* Content Viewport */}
        <div className="relative z-10 w-full min-h-screen">
          <NativeBackGesture>
            <AuthProvider>
              <OTABootstrap />
              <OptimisticUIProvider>
                <NavShell>
                  {children}
                </NavShell>
                <GlobalSpotlight />
                <Toaster />
              </OptimisticUIProvider>
            </AuthProvider>
          </NativeBackGesture>
        </div>
      </body>
    </html>
  );
}