40 lines
1.4 KiB
TypeScript
40 lines
1.4 KiB
TypeScript
|
import SineWavesCanvas from '@/components/animation/sine-wave'
|
|||
|
|
import React from 'react'
|
|||
|
|
|
|||
|
|
export default function StartLayout({
|
|||
|
|
children,
|
|||
|
|
}: {
|
|||
|
|
children: React.ReactNode
|
|||
|
|
}) {
|
|||
|
|
return (
|
|||
|
|
<div className="min-h-screen bg-gradient-to-br from-blue-50 via-blue-100 to-blue-200 flex">
|
|||
|
|
{/* 左侧插图区域 */}
|
|||
|
|
<div className="flex-1 flex items-center justify-end pr-16">
|
|||
|
|
<div className="max-w-lg text-center">
|
|||
|
|
{/* 插图SVG */}
|
|||
|
|
<div className="mb-12">
|
|||
|
|
<SineWavesCanvas width={500} height={300} />
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
{/* 标题文字 */}
|
|||
|
|
<h1 className="text-4xl font-bold text-slate-800 mb-6">
|
|||
|
|
智慧门户，尽在烽火
|
|||
|
|
</h1>
|
|||
|
|
<p className="text-slate-600 text-xl">
|
|||
|
|
览新闻，看公告，查信息，用服务
|
|||
|
|
</p>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
{/* 右侧表单区域 - 卡片样式 */}
|
|||
|
|
<div className="flex-1 flex items-center justify-start pl-16">
|
|||
|
|
<div className="w-full max-w-lg">
|
|||
|
|
<div className="bg-white rounded-2xl shadow-2xl px-12 py-16">
|
|||
|
|
{children}
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
)
|
|||
|
|
}
|