82 lines
4.1 KiB
TypeScript
82 lines
4.1 KiB
TypeScript
import { createRootRoute, Outlet, HeadContent, Scripts } from '@tanstack/react-router';
|
|
import { LazyMotion } from 'framer-motion';
|
|
import appCss from './globals.css?url';
|
|
|
|
const loadFeatures = () => import('framer-motion').then(res => res.domAnimation);
|
|
|
|
export const Route = createRootRoute({
|
|
head: () => ({
|
|
meta: [
|
|
{ charSet: "utf-8" },
|
|
{ name: "viewport", content: "width=device-width, initial-scale=1, maximum-scale=5, user-scalable=yes" },
|
|
{ title: "Mozimo - India's Premier European Style Bean to Bar Chocolate Experience" },
|
|
{ name: "description", content: "Mozimo's journey is a passionate pursuit of crafting exceptional chocolate that celebrates the origin of each cocoa bean. Experience the epitome of indulgence with our perfectly tempered chocolate." },
|
|
{ name: "keywords", content: "chocolate, bean to bar, artisanal chocolate, premium chocolate, Indian chocolate, European style chocolate, cocoa beans, chocolate tempering" },
|
|
{ name: "author", content: "Mozimo Chocolate" },
|
|
{ name: "google-site-verification", content: "vV-fEo3yXs8m0NUhB6JWhYI4pSH0uYVkbT8pgUWuU1I" },
|
|
|
|
// OpenGraph
|
|
{ property: "og:title", content: "Mozimo - Premium Artisanal Chocolate" },
|
|
{ property: "og:description", content: "India's Premier European Style Bean to Bar Chocolate Experience" },
|
|
{ property: "og:url", content: "https://mozimo.com" },
|
|
{ property: "og:site_name", content: "Mozimo Chocolate" },
|
|
{ property: "og:image", content: "/og-image.jpg" },
|
|
{ property: "og:locale", content: "en_US" },
|
|
{ property: "og:type", content: "website" },
|
|
|
|
// Twitter
|
|
{ name: "twitter:card", content: "summary_large_image" },
|
|
{ name: "twitter:title", content: "Mozimo - Premium Artisanal Chocolate" },
|
|
{ name: "twitter:description", content: "India's Premier European Style Bean to Bar Chocolate Experience" },
|
|
{ name: "twitter:image", content: "/og-image.jpg" },
|
|
],
|
|
links: [
|
|
{ rel: 'stylesheet', href: appCss },
|
|
{ rel: 'preconnect', href: 'https://fonts.googleapis.com' },
|
|
{ rel: 'preconnect', href: 'https://fonts.gstatic.com', crossOrigin: 'anonymous' },
|
|
{ rel: 'stylesheet', href: 'https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Playfair+Display:wght@400;500;600;700;800;900&display=swap' },
|
|
{ rel: 'icon', href: '/favicon.ico' },
|
|
{ rel: 'apple-touch-icon', sizes: '180x180', href: '/apple-touch-icon.png' },
|
|
{ rel: 'icon', type: 'image/png', sizes: '32x32', href: '/favicon-32x32.png' },
|
|
{ rel: 'icon', type: 'image/png', sizes: '16x16', href: '/favicon-16x16.png' },
|
|
{ rel: 'manifest', href: '/site.webmanifest' },
|
|
|
|
// Preload critical images
|
|
{ rel: 'preload', as: 'image', href: '/banners/slider-1.jpg' },
|
|
{ rel: 'preload', as: 'image', href: '/logo/logo.svg' },
|
|
{ rel: 'preload', as: 'image', href: '/bst/bs1.svg' },
|
|
|
|
// DNS prefetch
|
|
{ rel: 'dns-prefetch', href: '//fonts.googleapis.com' },
|
|
{ rel: 'dns-prefetch', href: '//fonts.gstatic.com' },
|
|
],
|
|
}),
|
|
component: RootLayout,
|
|
notFoundComponent: () => {
|
|
return (
|
|
<div>
|
|
<p>Not found!</p>
|
|
</div>
|
|
)
|
|
},
|
|
});
|
|
|
|
function RootLayout() {
|
|
return (
|
|
<html lang="en">
|
|
<head>
|
|
<HeadContent />
|
|
</head>
|
|
{/* We apply a generic font-sans class or remove Next.js specific font variables.
|
|
Since the Inter Google Font is loaded via the stylesheet above, it will automatically apply
|
|
if configured in Tailwind CSS. */}
|
|
<body>
|
|
<LazyMotion features={loadFeatures} strict>
|
|
<Outlet />
|
|
</LazyMotion>
|
|
<Scripts />
|
|
</body>
|
|
</html>
|
|
);
|
|
}
|