收敛最近项目标题与卡片字体并增加图片悬停缩放
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-13 23:24:22 +08:00
parent b1c89ab3ee
commit be9322583e

View File

@ -585,7 +585,7 @@ export function LovartHome({
<section ref={projectSectionRef} className="mt-20">
<div className="mb-4 flex items-center justify-between">
<h2 className="text-3xl font-semibold tracking-tight">最近项目</h2>
<h2 className="text-[18px] font-semibold tracking-tight">最近项目</h2>
<button
type="button"
className="inline-flex items-center gap-1 text-base text-black/45 hover:text-black"
@ -604,8 +604,8 @@ export function LovartHome({
>
<div className="flex aspect-[4/3] items-center justify-center rounded-2xl bg-[#efefef]">
<div className="text-center">
<div className="mb-2 text-4xl">+</div>
<div className="text-base">新建项目</div>
<div className="mb-2 text-3xl">+</div>
<div className="text-[14px]">新建项目</div>
</div>
</div>
</button>
@ -615,17 +615,21 @@ export function LovartHome({
key={item.id}
type="button"
onClick={() => router.push(`/canvas/${item.id}`)}
className="rounded-[22px] border border-black/8 bg-white p-3 text-left shadow-sm transition hover:-translate-y-0.5"
className="group rounded-[22px] border border-black/8 bg-white p-3 text-left shadow-sm transition hover:-translate-y-0.5"
>
<div className="aspect-[4/3] overflow-hidden rounded-2xl bg-[#efefef]">
{item.thumbnail ? (
<img src={item.thumbnail} alt={item.title} className="h-full w-full object-cover" />
<img
src={item.thumbnail}
alt={item.title}
className="h-full w-full object-cover transition-transform duration-300 ease-out group-hover:scale-[1.03]"
/>
) : (
<div className="flex h-full w-full items-center justify-center text-black/35">Untitled</div>
)}
</div>
<div className="mt-3 text-xl font-medium">{item.title || "Untitled"}</div>
<div className="mt-1 text-sm text-black/35">{formatRelativeTime(item.updatedAt || item.createdAt)}</div>
<div className="mt-3 text-[14px] font-medium">{item.title || "Untitled"}</div>
<div className="mt-1 text-xs text-black/35">{formatRelativeTime(item.updatedAt || item.createdAt)}</div>
</button>
))}