首页页面

This commit is contained in:
Eamon
2026-07-30 13:55:28 +08:00
parent 0361853732
commit 0d5e28c785
48 changed files with 2141 additions and 294 deletions

View File

@@ -1,50 +1,50 @@
import { useState } from "react"
import { Outlet } from "react-router-dom"
import { Content, Header, Mask, Navbar, Shell } from "./clients"
import Effects from "./effects"
import { LayoutProvider } from "./layout-context"
export default function AdminLayout() {
const [navbar, setNavbar] = useState(true)
const toggleNavbar = () => setNavbar(!navbar)
return (
<div className="relative h-dvh overflow-hidden">
<Shell navbar={navbar}>
<div className="col-start-1 row-start-1 row-span-2 bg-card overflow-hidden relative z-20">
<Navbar navbar={navbar} setNavbar={setNavbar} />
</div>
<LayoutProvider>
<Effects />
<div className="relative h-dvh overflow-hidden">
<Shell>
<div className="col-start-1 row-start-1 row-span-2 bg-card overflow-hidden relative z-20">
<Navbar />
</div>
<div className="col-start-2 row-start-1 bg-card overflow-hidden relative z-20">
<Header navbar={navbar} toggleNavbar={toggleNavbar} />
</div>
<div className="col-start-2 row-start-1 bg-card overflow-hidden relative z-20">
<Header />
</div>
<svg
className="col-start-2 row-start-2 w-full h-full z-20 pointer-events-none"
preserveAspectRatio="none"
>
<defs>
<mask id="top-left-rounded-mask">
<rect width="100%" height="100%" fill="white" />
<circle cx="16" cy="16" r="16" fill="black" />
<rect x="16" y="0" width="100%" height="32" fill="black" />
<rect x="0" y="16" width="32" height="100%" fill="black" />
<rect x="16" y="16" width="100%" height="100%" fill="black" />
</mask>
</defs>
<rect
width="100%"
height="100%"
className="fill-card"
mask="url(#top-left-rounded-mask)"
/>
</svg>
<svg
className="col-start-2 row-start-2 w-full h-full z-20 pointer-events-none"
preserveAspectRatio="none"
>
<defs>
<mask id="top-left-rounded-mask">
<rect width="100%" height="100%" fill="white" />
<circle cx="16" cy="16" r="16" fill="black" />
<rect x="16" y="0" width="100%" height="32" fill="black" />
<rect x="0" y="16" width="32" height="100%" fill="black" />
<rect x="16" y="16" width="100%" height="100%" fill="black" />
</mask>
</defs>
<rect
width="100%"
height="100%"
className="fill-card"
mask="url(#top-left-rounded-mask)"
/>
</svg>
<Mask navbar={navbar} setNavbar={setNavbar} />
</Shell>
<Mask />
</Shell>
{/* 用 Outlet 替代 {props.children} */}
<Content navbar={navbar}>
<Outlet />
</Content>
</div>
<Content>
<Outlet />
</Content>
</div>
</LayoutProvider>
)
}