lunanting/ai-chatbot
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix inspiration empty state being split by columns layout
Some checks failed
Lint / build (20) (push) Has been cancelled
Details
Playwright Tests / test (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Your Name 2026-02-14 02:29:49 +08:00
parent 1669047c11
commit b7886df1dc
1 changed files with 39 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

78
components/home/lovart-home.tsx
View File

@ -1172,48 +1172,48 @@ export function LovartHome({
))} ))}
</div> </div>
<div className="mt-5 columns-1 gap-4 md:columns-2 xl:columns-4"> {featuredItems.length === 0 ? (
{featuredItems.map((item, index) => ( <div className="mt-5 rounded-xl border border-dashed border-black/15 bg-white p-10 text-center text-black/35">
<button {isLoadingFeatured ? "灵感内容加载中..." : "当前没有可展示的灵感数据。"}
key={item.id} </div>
type="button" ) : (
onClick={() => window.open(item.originalUrl || item.thumbnailUrl, "_blank")} <div className="mt-5 columns-1 gap-4 md:columns-2 xl:columns-4">
className="group mb-4 block w-full break-inside-avoid rounded-2xl border border-black/8 bg-white text-left shadow-sm" {featuredItems.map((item, index) => (
> <button
<div key={item.id}
className="overflow-hidden rounded-t-2xl bg-[#e8e8e8]" type="button"
style={{ height: `${MASONRY_HEIGHTS[index % MASONRY_HEIGHTS.length]}px` }} onClick={() => window.open(item.originalUrl || item.thumbnailUrl, "_blank")}
className="group mb-4 block w-full break-inside-avoid rounded-2xl border border-black/8 bg-white text-left shadow-sm"
> >
<img <div
src={item.thumbnailUrl || item.originalUrl} className="overflow-hidden rounded-t-2xl bg-[#e8e8e8]"
alt={item.prompt || "灵感图"} style={{ height: `${MASONRY_HEIGHTS[index % MASONRY_HEIGHTS.length]}px` }}
className="h-full w-full object-cover transition-transform duration-300 ease-out group-hover:scale-[1.02]" >
/> <img
</div> src={item.thumbnailUrl || item.originalUrl}
<div className="flex items-center justify-between px-3 py-2 text-[12px] text-black/60"> alt={item.prompt || "灵感图"}
<div className="line-clamp-1 font-medium text-black/85"> className="h-full w-full object-cover transition-transform duration-300 ease-out group-hover:scale-[1.02]"
{item.user?.name || "创作者"} />
</div> </div>
<div className="inline-flex items-center gap-2 text-[11px]"> <div className="flex items-center justify-between px-3 py-2 text-[12px] text-black/60">
<span className="inline-flex items-center gap-1"> <div className="line-clamp-1 font-medium text-black/85">
<Sparkles className="h-2.5 w-2.5" /> {item.user?.name || "创作者"}
{(1200 + index * 37).toLocaleString()} </div>
</span> <div className="inline-flex items-center gap-2 text-[11px]">
<span className="inline-flex items-center gap-1"> <span className="inline-flex items-center gap-1">
<Heart className="h-2.5 w-2.5" /> <Sparkles className="h-2.5 w-2.5" />
{(20 + (index % 9) * 11).toLocaleString()} {(1200 + index * 37).toLocaleString()}
</span> </span>
<span className="inline-flex items-center gap-1">
<Heart className="h-2.5 w-2.5" />
{(20 + (index % 9) * 11).toLocaleString()}
</span>
</div>
</div> </div>
</div> </button>
</button> ))}
))} </div>
)}
{featuredItems.length === 0 && (
<div className="rounded-xl border border-dashed border-black/15 bg-white p-10 text-center text-black/35">
{isLoadingFeatured ? "灵感内容加载中..." : "当前没有可展示的灵感数据。"}
</div>
)}
</div>
<div ref={featuredLoadMoreRef} className="mt-3 flex h-10 items-center justify-center"> <div ref={featuredLoadMoreRef} className="mt-3 flex h-10 items-center justify-center">
{isLoadingMoreFeatured ? ( {isLoadingMoreFeatured ? (
<div className="inline-flex items-center gap-2 text-sm text-black/45"> <div className="inline-flex items-center gap-2 text-sm text-black/45">