diff --git a/src/components/creation-home/CreationLandingView.test.tsx b/src/components/creation-home/CreationLandingView.test.tsx index a403c7f45..b2333be8c 100644 --- a/src/components/creation-home/CreationLandingView.test.tsx +++ b/src/components/creation-home/CreationLandingView.test.tsx @@ -611,10 +611,42 @@ describe('CreationLandingView', () => { '.creation-landing__asset-preview', ) as HTMLElement | null; expect(firstPreview?.style.aspectRatio).toBe('512 / 640'); + expect(firstPreview?.className).not.toContain( + 'creation-landing__asset-preview--campaign', + ); expect(screen.queryByText('经典 RPG 体验')).toBeNull(); expect(screen.queryByText('拼图关卡创作')).toBeNull(); }); + it('renders campaign card previews with centered contain media', async () => { + listEditorProjectsMock.mockResolvedValue(projectItems); + listPublicEditorProjectResourcesMock.mockResolvedValue({ + resources: [], + nextCursor: null, + campaign: { + enabled: true, + title: '活动精选', + imageSrc: '/campaign.png', + imageWidth: 900, + imageHeight: 1200, + prompt: '活动提示词', + author: '运营', + costText: '50泥点', + }, + }); + + const { container } = renderCreationLanding(); + + expect(await screen.findByText('活动精选')).toBeTruthy(); + const campaignPreview = container.querySelector( + '.creation-landing__asset-preview', + ) as HTMLElement | null; + expect(campaignPreview?.className).toContain( + 'creation-landing__asset-preview--campaign', + ); + expect(campaignPreview?.style.aspectRatio).toBe('900 / 1200'); + }); + it('loads more featured resources when the waterfall reaches the end', async () => { const observers = installIntersectionObserverMock(); listEditorProjectsMock.mockResolvedValueOnce(projectItems); diff --git a/src/components/creation-home/CreationLandingView.tsx b/src/components/creation-home/CreationLandingView.tsx index ec07c8e04..ea7b08279 100644 --- a/src/components/creation-home/CreationLandingView.tsx +++ b/src/components/creation-home/CreationLandingView.tsx @@ -282,6 +282,13 @@ function ShowcaseVideoPreview({ function ShowcaseBundlePreview({ item }: { item: ShowcaseAssetItem }) { const visiblePreviews = item.previews.slice(0, 4); const primaryPreview = visiblePreviews[0]; + const previewClassName = [ + 'creation-landing__asset-preview', + item.previews.length > 1 ? 'creation-landing__asset-preview--bundle' : '', + item.campaign ? 'creation-landing__asset-preview--campaign' : '', + ] + .filter(Boolean) + .join(' '); if (!primaryPreview) { return null; @@ -289,11 +296,7 @@ function ShowcaseBundlePreview({ item }: { item: ShowcaseAssetItem }) { return (