Files
web/src/components/page.tsx

31 lines
1.1 KiB
TypeScript

import {ComponentProps} from 'react'
import {merge} from '@/lib/utils'
export type PageProps = {
mode?: 'full' | 'blank'
}
export default function Page(props: ComponentProps<'main'> & PageProps) {
return (
<main {...props} className={merge(`relative size-full`)}>
{/* background */}
<div className="absolute inset-0 overflow-hidden">
<div className="absolute w-screen h-screen bg-gray-50"></div>
<div className="absolute w-[2000px] h-[2000px] -left-[1000px] -top-[1000px] bg-radial from-blue-50/50 from-10% to-transparent to-50%"></div>
<div className="absolute w-[2000px] h-[2000px] -right-[1000px] -top-[1000px] bg-radial from-blue-50/50 from-10% to-transparent to-50%"></div>
<div className="absolute w-[2000px] h-[2000px] left-[calc(50%-1000px)] -bottom-[1000px] bg-radial from-blue-50/50 from-10% to-transparent to-50%"></div>
</div>
{/* content */}
<div className={merge(
`relative w-full h-full`,
`flex flex-col gap-4 p-4 overflow-auto`,
props.className,
)}>
{props.children}
</div>
</main>
)
}