Update gallery to display landscape images and use original file names

Modify the gallery component to use 16:9 aspect ratio for images on all devices, and update the server-side logic to fetch original file names from Dropbox, including handling special characters for accurate artist extraction.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 1f7e7e89-a520-4970-9645-37daadc466dc
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Event-Id: af9e6e2b-bfc5-48ee-8177-e2ffdffe6967
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/f209e72a-0939-48fa-84fc-57854de71967/1f7e7e89-a520-4970-9645-37daadc466dc/ZApZ5Qi
Replit-Helium-Checkpoint-Created: true
This commit is contained in:
sebastjanartic
2026-03-05 14:11:41 +00:00
parent 0425a1082c
commit 40dd11ebc8
3 changed files with 344 additions and 814 deletions
+2 -2
View File
@@ -338,9 +338,9 @@ export default function GalleryPage() {
className="group relative rounded-lg overflow-hidden bg-card border border-card-border cursor-pointer flex flex-col"
data-testid={`button-gallery-image-${i}`}
>
<div className="relative w-full aspect-[16/9] md:aspect-[9/16]">
<div className="relative w-full aspect-[16/9]">
<LazyImage
src={isMobile && img.mobile ? img.mobile : thumbUrl(img.thumb)}
src={img.mobile || thumbUrl(img.thumb)}
alt={img.artist || img.fileName}
className="absolute inset-0 w-full h-full transition-transform duration-500 group-hover:scale-110"
/>