CRT/storebound
1
0
Fork 0
Code Issues Pull requests Releases 1 Packages 1 Activity Actions

Desktop: app hero without screenshots no longer shows a cropped second copy of the icon

Browse source
This commit is contained in:
CRTkafa 2026-10-23 08:39:51 +08:00
parent 618ff9e488
commit 707db2ebc6
2 changed files with 4 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

3
apps/desktop/src/design.css
View file

@ -99,9 +99,6 @@
.ds-hero-shots img { height: 280px; width: auto; aspect-ratio: 9 / 19.5; object-fit: cover; object-position: top; border-radius: 16px; box-shadow: 0 18px 36px -14px rgba(0, 0, 0, .55); flex: none; transition: transform var(--speed) var(--ease); }
.ds-hero-shots img:nth-child(even) { margin-top: 26px; }
.ds-hero:hover .ds-hero-shots img { transform: translateY(-3px); }
.ds-hero-shots.empty { align-items: center; justify-content: center; padding: 0; width: 300px; -webkit-mask-image: none; mask-image: none;
background: radial-gradient(60% 70% at 50% 50%, hsl(var(--tint-h) var(--ds-tint-s) var(--ds-tint-l) / .40), transparent 70%); }
.ds-hero-shots .pf-hero-icon { width: 120px; height: 120px; border-radius: 30px; font-size: 36px; box-shadow: 0 22px 48px -16px hsl(var(--tint-h) 70% 30% / .75), inset 0 0 0 1px rgba(255, 255, 255, .12); }
@media (max-width: 1180px) { .ds-hero { grid-template-columns: minmax(0, 1fr); } .ds-hero-shots { display: none; } }
@media (max-width: 900px) { .ds-hero-pipe { grid-template-columns: minmax(0, 1fr); } .ds-hero-foot { justify-items: start; } }

7
apps/desktop/src/ui/ds.tsx
View file

@ -205,9 +205,10 @@ export function Hero({ name, icon, projectId, ids, badges, links, all, ios, andr
</div>
{children}
</div>
<div className={`ds-hero-shots${shots.length ? '' : ' empty'}`} aria-hidden="true">
{shots.length ? shots.map((s, i) => <img key={i} src={s} alt="" draggable={false} />) : <AppIcon name={name} src={icon} className="pf-hero-icon" />}
</div>
{/* no screenshots: no second (cropped) copy of the icon, which already leads the hero */}
{shots.length > 0 && <div className="ds-hero-shots" aria-hidden="true">
{shots.map((s, i) => <img key={i} src={s} alt="" draggable={false} />)}
</div>}
</section>
);
}