mirror of
https://github.com/luxfi/forum.git
synced 2026-09-24 00:24:25 +00:00
zeekayandHanzo Dev
17bd239f2a
Tailwind 4 out — the engine import, the `@custom-variant`, and the `@theme inline` wrapper. The tokens inside it were always plain custom properties and are untouched; what goes is the thing that was reading them. Every class attribute now reaches a converter rather than the document: Box for an element, css for an icon, the component itself for anything from @hanzo/ui. The body's ground moves into the sheet, since <body> sits outside the provider and reads no classes. The library's sheets are imported from the LAYOUT rather than @import-ed from the app's CSS: a bare package specifier does not resolve in this pipeline and the failure is silent — the whole file is dropped, so every token goes missing and the page renders on browser defaults. Also on the current toolchain: React 19.2.8, Next 16.3.3, TypeScript 7. Measured at 390px and 1280px: 4/4 page-widths clean, nothing unread. Co-authored-by: Hanzo Dev <[email protected]>
53 lines
1.3 KiB
TypeScript
53 lines
1.3 KiB
TypeScript
import type { Metadata } from 'next';
|
|
import { Hanzo } from '@hanzo/ui'
|
|
import { Inter } from 'next/font/google';
|
|
import { ThemeProvider } from 'next-themes';
|
|
import '@hanzo/ui/theme.css';
|
|
import '@hanzo/ui/styles.css';
|
|
import './global.css';
|
|
|
|
const inter = Inter({
|
|
subsets: ['latin'],
|
|
variable: '--font-sans',
|
|
});
|
|
|
|
export const metadata: Metadata = {
|
|
title: 'Lux Forum',
|
|
description: 'Community discussions for Lux Network - share ideas, ask questions, and connect.',
|
|
metadataBase: new URL('https://lux.forum'),
|
|
openGraph: {
|
|
title: 'Lux Forum',
|
|
description: 'Community discussions for Lux Network - share ideas, ask questions, and connect.',
|
|
siteName: 'Lux Forum',
|
|
type: 'website',
|
|
},
|
|
twitter: {
|
|
card: 'summary_large_image',
|
|
title: 'Lux Forum',
|
|
description: 'Community discussions for Lux Network - share ideas, ask questions, and connect.',
|
|
},
|
|
};
|
|
|
|
export default function RootLayout({
|
|
children,
|
|
}: {
|
|
children: React.ReactNode;
|
|
}) {
|
|
return (
|
|
<html lang="en" suppressHydrationWarning className={inter.variable}>
|
|
<body>
|
|
<Hanzo>
|
|
<ThemeProvider
|
|
attribute="class"
|
|
defaultTheme="system"
|
|
enableSystem
|
|
disableTransitionOnChange
|
|
>
|
|
{children}
|
|
</ThemeProvider>
|
|
</Hanzo>
|
|
</body>
|
|
</html>
|
|
);
|
|
}
|