40 lines
1.3 KiB
TypeScript
40 lines
1.3 KiB
TypeScript
import { GenerationDotPlaceholder } from "@/components/generation-dot-placeholder";
|
|
|
|
export default function ParticlePreviewPage() {
|
|
return (
|
|
<main className="min-h-screen bg-[#f7f7f7] px-10 py-10 text-[#202124]">
|
|
<div className="mx-auto flex max-w-6xl flex-col gap-8">
|
|
<div>
|
|
<h1 className="text-[28px] font-semibold tracking-tight">生成占位粒子预览</h1>
|
|
<p className="mt-2 text-[14px] text-[#7d838b]">
|
|
单独预览旋转粒子、3D 视差和进度条状态。
|
|
</p>
|
|
</div>
|
|
|
|
<div className="grid gap-8 lg:grid-cols-[420px_1fr]">
|
|
<section>
|
|
<div className="mb-3 text-[14px] font-medium text-[#5f6670]">对话框尺寸</div>
|
|
<GenerationDotPlaceholder
|
|
className="h-[420px] w-[420px]"
|
|
phase="processing"
|
|
progress={41}
|
|
title="正在创建图片"
|
|
/>
|
|
</section>
|
|
|
|
<section>
|
|
<div className="mb-3 text-[14px] font-medium text-[#5f6670]">画布节点尺寸</div>
|
|
<GenerationDotPlaceholder
|
|
className="h-[360px] w-full"
|
|
compact
|
|
phase="processing"
|
|
progress={67}
|
|
title="正在润饰细节"
|
|
/>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
);
|
|
}
|