style: refine image generation placeholder proportions
Some checks failed
Lint / build (20) (push) Has been cancelled
Playwright Tests / test (push) Has been cancelled

This commit is contained in:
Your Name 2026-02-21 02:13:16 +08:00
parent 38b0a87fe1
commit 9a1cbc4d15

View File

@ -64,27 +64,27 @@ export const ImageGenerationLoading = memo(
data-role="assistant"
data-testid="message-assistant-image-loading"
>
<div className="w-full max-w-[760px] space-y-3">
<div className="w-full max-w-[680px] space-y-2.5">
<div className="flex items-center gap-2 text-[13px] text-[#9aa3b2]">
<ChevronDown className="h-4 w-4" />
<span className="font-medium">开始生成</span>
</div>
<div className="text-[16px] leading-8 text-[#3a4352]">
<div className="text-[15px] leading-7 text-[#3a4352]">
现在开始生成设计图,使用 {resolvedModelName} 模型,预计需要 {estimateMinutes} 分钟。
</div>
<div className="flex items-center gap-2 text-[#a8b1bf]">
<CircleDot className="h-3.5 w-3.5 fill-current" />
<span className="text-[16px]">{resolvedModelName}</span>
<span className="text-[14px]">{resolvedModelName}</span>
</div>
<div className="text-[42px] font-semibold text-[#37404d]">{PHASE_TITLE[phase]}</div>
<div className="text-[34px] font-semibold leading-none text-[#37404d]">{PHASE_TITLE[phase]}</div>
<div
className={cn(
"relative overflow-hidden rounded-[22px] border border-[#e1e4ea] bg-[#eaedf2]",
count === 1 ? "h-[620px] w-full max-w-[680px]" : "grid gap-3 p-3",
count === 1 ? "h-[420px] w-full max-w-[560px]" : "grid gap-3 p-3",
count > 1 && "grid-cols-2"
)}
>
@ -97,7 +97,7 @@ export const ImageGenerationLoading = memo(
Array.from({ length: count }).map((_, index) => (
<div
key={index}
className="relative h-[220px] overflow-hidden rounded-2xl border border-[#dfe3e9] bg-[#e7ebf0]"
className="relative h-[180px] overflow-hidden rounded-2xl border border-[#dfe3e9] bg-[#e7ebf0]"
>
<div className="absolute inset-0 bg-gradient-to-r from-[#e7ebf0] via-[#dce2ea] to-[#e7ebf0]" />
<div
@ -109,7 +109,7 @@ export const ImageGenerationLoading = memo(
)}
</div>
<div className="flex items-center gap-2 pt-1 text-[18px] text-[#8c95a3]">
<div className="flex items-center gap-2 pt-1 text-[16px] text-[#8c95a3]">
<Grid2x2 className="h-5 w-5" />
<span className="font-medium">{isFailed ? "生成失败" : "设计图生成中"}</span>
</div>