sebastjan/folx-tv
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Adjust gallery lightbox to display full images without cropping

Browse Source 
Update the image display in the gallery lightbox to use `object-contain` and adjust container size to prevent cropping, ensuring full images are visible.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 23852c00-4779-460a-9e0c-d09fee4b6c92
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Event-Id: e3bc7997-6f11-45f3-ac2e-cfc4a9e4715b
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/f209e72a-0939-48fa-84fc-57854de71967/23852c00-4779-460a-9e0c-d09fee4b6c92/nlGTLC9
Replit-Helium-Checkpoint-Created: true
This commit is contained in:
sebastjanartic 2026-03-06 10:25:31 +00:00
parent 7069ac1520
commit 7f1b7bbf83
1 changed files with 2 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
client/src/components/photo-gallery.tsx
View File

@ -123,11 +123,11 @@ function Lightbox({
<ChevronRight className="w-10 h-10" />
</button>
<div className="w-[85vh] h-[85vh] max-w-[95vw] max-h-[95vw] flex items-center justify-center" onClick={(e) => e.stopPropagation()}>
<div className="max-w-[90vw] max-h-[85vh] flex items-center justify-center" onClick={(e) => e.stopPropagation()}>
<img
src={current.large}
alt={current.artist || current.fileName}
className="w-full h-full object-cover rounded-lg"
className="max-w-full max-h-[85vh] object-contain rounded-lg"
data-testid="img-lightbox"
/>
</div>