46 lines
1.4 KiB
TypeScript
46 lines
1.4 KiB
TypeScript
import {
|
|
HeadContent,
|
|
Outlet,
|
|
Scripts,
|
|
createRootRouteWithContext,
|
|
} from '@tanstack/react-router'
|
|
import type { QueryClient } from '@tanstack/react-query'
|
|
import { Toaster } from '@/components/ui/sonner'
|
|
|
|
import appCss from '../styles.css?url'
|
|
|
|
const THEME_INIT_SCRIPT = `(function(){try{var stored=window.localStorage.getItem('theme');var prefersDark=window.matchMedia('(prefers-color-scheme: dark)').matches;var resolved=stored==='dark'||(stored!=='light'&&prefersDark)?'dark':'light';document.documentElement.classList.toggle('dark',resolved==='dark');document.documentElement.style.colorScheme=resolved;}catch(e){}})();`
|
|
|
|
interface RouterContext {
|
|
queryClient: QueryClient
|
|
}
|
|
|
|
export const Route = createRootRouteWithContext<RouterContext>()({
|
|
head: () => ({
|
|
meta: [
|
|
{ charSet: 'utf-8' },
|
|
{ name: 'viewport', content: 'width=device-width, initial-scale=1' },
|
|
{ title: 'Gig 管理后台' },
|
|
],
|
|
links: [{ rel: 'stylesheet', href: appCss }],
|
|
}),
|
|
shellComponent: RootDocument,
|
|
component: () => <Outlet />,
|
|
})
|
|
|
|
function RootDocument({ children }: { children: React.ReactNode }) {
|
|
return (
|
|
<html lang="zh-CN" suppressHydrationWarning>
|
|
<head>
|
|
<script dangerouslySetInnerHTML={{ __html: THEME_INIT_SCRIPT }} />
|
|
<HeadContent />
|
|
</head>
|
|
<body className="font-sans antialiased">
|
|
{children}
|
|
<Toaster position="top-center" richColors />
|
|
<Scripts />
|
|
</body>
|
|
</html>
|
|
)
|
|
}
|