quick look logo overlays hero image, bigger, bottom-centered

This commit is contained in:
2026-04-06 21:38:35 +03:00
parent 6461d9e168
commit 817f961d07
+9 -10
View File
@@ -101,21 +101,20 @@ export default function QuickLookModal() {
{heroImg && ( {heroImg && (
<div className="relative aspect-[16/8] overflow-hidden bg-elevated"> <div className="relative aspect-[16/8] overflow-hidden bg-elevated">
<img src={heroImg} alt={item.Name || ''} className="w-full h-full object-cover" /> <img src={heroImg} alt={item.Name || ''} className="w-full h-full object-cover" />
<div className="absolute inset-0 bg-gradient-to-t from-surface via-surface/40 to-transparent" /> <div className="absolute inset-0 bg-gradient-to-t from-surface via-surface/50 to-transparent" />
</div> {logoUrl && (
)}
<div className="p-6 -mt-8 relative">
{logoUrl ? (
<div className="mb-2 flex justify-start">
<img <img
src={logoUrl} src={logoUrl}
alt={item.Name || ''} alt={item.Name || ''}
className="block h-auto max-h-14 md:max-h-16 max-w-[380px] w-auto drop-shadow-[0_4px_24px_rgba(0,0,0,0.7)]" className="absolute bottom-4 left-1/2 -translate-x-1/2 h-auto max-h-20 md:max-h-24 max-w-[520px] w-auto drop-shadow-[0_4px_32px_rgba(0,0,0,0.9)]"
onError={e => { (e.target as HTMLImageElement).style.display = 'none' }} onError={e => { (e.target as HTMLImageElement).style.display = 'none' }}
/> />
</div> )}
) : ( </div>
)}
<div className="p-6 relative">
{!logoUrl && (
<h2 className="text-[22px] font-display font-bold tracking-tight text-text-1 mb-2 leading-tight"> <h2 className="text-[22px] font-display font-bold tracking-tight text-text-1 mb-2 leading-tight">
{item.Name} {item.Name}
</h2> </h2>