mirror of
https://github.com/hanzo-apps/gallery.git
synced 2026-10-30 14:48:38 +00:00
The site fetched a third-party family from a font host at build time and
minted a per-build family name that <body> had to carry as a class, while
body itself was pinned to Arial. Two type systems, neither of them ours.
@hanzo/font ships Zen as woff2 in the package; its /css entry is @font-face
plus --font-zen-sans/--font-zen-mono, and globals.css binds those to
--font-sans/--font-mono, which is what Tailwind's utilities already read.
No request leaves the origin.
public/previews/{arch,betacrm-html} are vendored third-party template
samples served as previews; they name their own faces and are left alone.
107 lines
3.3 KiB
TypeScript
107 lines
3.3 KiB
TypeScript
import type { Metadata } from "next";
|
|
// THE FACES. Zen is the Hanzo family and `@hanzo/font` is where it is authored;
|
|
// this entry is @font-face and nothing else, plus --font-zen-sans/--font-zen-mono
|
|
// on :root, which globals.css binds to --font-sans/--font-mono. First, so the
|
|
// faces are declared before anything reads them.
|
|
//
|
|
// It replaced `next/font/google`, which fetched a third-party family at build
|
|
// time and minted a per-build family name that every element then had to carry
|
|
// as a class. The faces ship in the package; nothing to remember to apply.
|
|
import "@hanzo/font/css";
|
|
import "./globals.css";
|
|
import { Header } from "./components/header";
|
|
import { Footer } from "./components/footer";
|
|
|
|
export const metadata: Metadata = {
|
|
metadataBase: new URL('https://gallery.hanzo.ai'),
|
|
title: {
|
|
default: "Hanzo Templates Gallery - 75+ Premium UI/UX Templates",
|
|
template: "%s | Hanzo Templates",
|
|
},
|
|
description: "Browse 75+ production-ready templates built with Next.js, React, and modern frameworks. Free, open-source templates for SaaS, portfolios, dashboards, blogs, and more. Deploy instantly to Hanzo Cloud.",
|
|
keywords: [
|
|
"Next.js templates",
|
|
"React templates",
|
|
"UI templates",
|
|
"SaaS templates",
|
|
"portfolio templates",
|
|
"dashboard templates",
|
|
"blog templates",
|
|
"free templates",
|
|
"open source templates",
|
|
"Hanzo templates",
|
|
"web templates",
|
|
"modern UI",
|
|
"responsive templates",
|
|
"TypeScript templates",
|
|
],
|
|
authors: [{ name: "Hanzo AI", url: "https://hanzo.ai" }],
|
|
creator: "Hanzo AI",
|
|
publisher: "Hanzo AI",
|
|
openGraph: {
|
|
type: "website",
|
|
locale: "en_US",
|
|
url: "https://gallery.hanzo.ai",
|
|
title: "Hanzo Templates Gallery - 75+ Premium UI/UX Templates",
|
|
description: "Browse 75+ production-ready templates built with Next.js, React, and modern frameworks. Free, open-source templates for SaaS, portfolios, dashboards, blogs, and more.",
|
|
siteName: "Hanzo Templates Gallery",
|
|
images: [
|
|
{
|
|
url: "/og-image.png",
|
|
width: 1200,
|
|
height: 630,
|
|
alt: "Hanzo Templates Gallery - Premium Templates Collection",
|
|
},
|
|
],
|
|
},
|
|
twitter: {
|
|
card: "summary_large_image",
|
|
title: "Hanzo Templates Gallery - 75+ Premium UI/UX Templates",
|
|
description: "Browse 75+ production-ready templates built with Next.js, React, and modern frameworks. Deploy instantly to Hanzo Cloud.",
|
|
images: ["/twitter-image.png"],
|
|
creator: "@hanzoai",
|
|
},
|
|
robots: {
|
|
index: true,
|
|
follow: true,
|
|
googleBot: {
|
|
index: true,
|
|
follow: true,
|
|
'max-video-preview': -1,
|
|
'max-image-preview': 'large',
|
|
'max-snippet': -1,
|
|
},
|
|
},
|
|
viewport: {
|
|
width: 'device-width',
|
|
initialScale: 1,
|
|
maximumScale: 5,
|
|
},
|
|
themeColor: [
|
|
{ media: '(prefers-color-scheme: dark)', color: '#0a0a0a' },
|
|
{ media: '(prefers-color-scheme: light)', color: '#ffffff' },
|
|
],
|
|
icons: {
|
|
icon: '/favicon.ico',
|
|
apple: '/apple-icon.png',
|
|
},
|
|
};
|
|
|
|
export default function RootLayout({
|
|
children,
|
|
}: Readonly<{
|
|
children: React.ReactNode;
|
|
}>) {
|
|
return (
|
|
<html lang="en" className="dark">
|
|
<body className="antialiased bg-[#0a0a0a] text-white">
|
|
<Header />
|
|
<main className="pt-16">
|
|
{children}
|
|
</main>
|
|
<Footer />
|
|
</body>
|
|
</html>
|
|
);
|
|
}
|