Files
doormile_react/src/app/layout.tsx
2026-06-04 14:51:13 +05:30

119 lines
4.4 KiB
TypeScript

/* eslint-disable @next/next/no-css-tags */
import type { Metadata } from "next";
import { Manrope, Space_Grotesk, Syne, DM_Sans, Inter } from "next/font/google";
import "./globals.css";
import Header from "@/components/layout/Header";
import Footer from "@/components/layout/Footer";
import BodyClasses from "@/components/layout/BodyClasses";
import BodyOverlay from "@/components/layout/BodyOverlay";
import { HeaderUIProvider } from "@/components/layout/HeaderUIProvider";
import { SHARED_BODY_CLASSES } from "@/lib/bodyClasses";
import AnimationProvider from "@/animations/AnimationProvider";
import SmoothScroll from "@/animations/SmoothScroll";
import LoadingScreen from "@/components/layout/LoadingScreen";
const manrope = Manrope({
subsets: ["latin"],
variable: "--font-manrope",
weight: ["200", "300", "400", "500", "600", "700", "800"],
});
const spaceGrotesk = Space_Grotesk({
subsets: ["latin"],
variable: "--font-space-grotesk",
weight: ["400", "500", "600", "700"],
});
// Fonts for the Solutions industry section (Syne headings, DM Sans body).
const syne = Syne({
subsets: ["latin"],
variable: "--font-syne",
weight: ["600", "700", "800"],
});
const dmSans = DM_Sans({
subsets: ["latin"],
variable: "--font-dm-sans",
weight: ["400", "500"],
});
// Body font for the Solutions stacked industry sections.
const inter = Inter({
subsets: ["latin"],
variable: "--font-inter",
weight: ["400", "500", "600"],
});
export const metadata: Metadata = {
title: "Doormile — Last-Mile Logistics Intelligence",
description: "Doormile powers last-mile logistics with MileTruth™ AI, providing connected miles, SLA protection, and carrier management.",
icons: {
icon: "/images/cropped-image-2.png",
shortcut: "/images/cropped-image-2.png",
apple: "/images/cropped-image-2.png",
},
robots: {
index: true,
follow: true,
},
};
export default function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
return (
<html lang="en-US" data-scroll-behavior="smooth" className={`${manrope.variable} ${spaceGrotesk.variable} ${syne.variable} ${dmSans.variable} ${inter.variable}`}>
<head>
{/* FontAwesome icons */}
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css"
/>
{/* Load WordPress & Elementor compiled styles from public folder */}
<link rel="stylesheet" href="/css/vendor/vendor-elementor-generated-globals.css" />
<link rel="stylesheet" href="/css/vendor/vendor-elementor-base.css" />
<link rel="stylesheet" href="/css/vendor/vendor-elementor-custom.min.css" />
<link rel="stylesheet" href="/css/vendor/vendor-theme-core.css" />
<link rel="stylesheet" href="/css/vendor/vendor-global-overrides.css" />
<link rel="stylesheet" href="/css/vendor/vendor-layout-main.css" />
<link rel="stylesheet" href="/css/vendor/vendor-responsive-laptops.css" />
<link rel="stylesheet" href="/css/vendor/vendor-elementor-hfe.css" />
<link rel="stylesheet" href="/css/vendor/vendor-icons-fontello-load.css" />
<link rel="stylesheet" href="/css/vendor/vendor-icons-fontello.css" />
<link rel="stylesheet" href="/css/custom-frontend.min.css" />
<link rel="stylesheet" href="/css/all-inlined-head-styles.css" />
</head>
{/*
Production DOM (index.php + header.php):
body
├─ body-overlay (direct child of body — index.php line 6 / header.php line 5)
├─ body-container (header.php line 14)
│ └─ #page.hfeed.site (header.php line 15)
│ ├─ header#masthead
│ ├─ content-wrapper (children)
│ └─ footer
SSR ships body with shared WP/Elementor classes; BodyClasses (client) refines per route.
*/}
<body className={SHARED_BODY_CLASSES}>
<BodyClasses />
<LoadingScreen />
<AnimationProvider>
<SmoothScroll />
<HeaderUIProvider>
<BodyOverlay />
<div className="body-container">
<div id="page" className="hfeed site">
<Header />
{children}
<Footer />
</div>
</div>
</HeaderUIProvider>
</AnimationProvider>
</body>
</html>
);
}