pacnpal/thrilltrack-explorer
1
0
Fork 0
mirror of https://github.com/pacnpal/thrilltrack-explorer.git synced 2025-12-23 12:51:13 -05:00
Code Issues Packages Projects Releases Wiki Activity

Refactor photo display

Browse Source
This commit is contained in:
gpt-engineer-app[bot]
2025-10-02 14:03:03 +00:00
parent b43f794956
commit d00b0ba71a
1 changed files with 6 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/components/moderation/PhotoModal.tsx
View File

@@ -93,9 +93,11 @@ export function PhotoModal({ photos, initialIndex, isOpen, onClose }: PhotoModal
{/* Header */}
<div className={`absolute top-0 left-0 right-0 z-10 bg-gradient-to-b from-black/80 to-transparent ${isMobile ? 'p-3' : 'p-4'}`}>
<div className="text-white">
<h3 className={`font-medium ${isMobile ? 'text-sm pr-12' : ''}`}>
{currentPhoto?.filename || `Photo ${currentIndex + 1}`}
</h3>
{currentPhoto?.caption && (
<h3 className={`font-medium ${isMobile ? 'text-sm pr-12' : ''}`}>
{currentPhoto.caption}
</h3>
)}
{photos.length > 1 && (
<p className={`text-white/70 ${isMobile ? 'text-xs' : 'text-sm'}`}>
{currentIndex + 1} of {photos.length}
@@ -140,7 +142,7 @@ export function PhotoModal({ photos, initialIndex, isOpen, onClose }: PhotoModal
{/* Mobile navigation dots */}
{photos.length > 1 && isMobile && (
<div className="absolute bottom-20 left-0 right-0 flex justify-center gap-2 px-4">
<div className="absolute bottom-4 left-0 right-0 flex justify-center gap-2 px-4">
{photos.map((_, idx) => (
<button
key={idx}
@@ -155,13 +157,6 @@ export function PhotoModal({ photos, initialIndex, isOpen, onClose }: PhotoModal
))}
</div>
)}
{/* Caption */}
{currentPhoto?.caption && (
<div className={`absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/80 to-transparent ${isMobile ? 'p-3' : 'p-4'} ${isMobile && photos.length > 1 ? 'pb-14' : ''}`}>
<p className={`text-white ${isMobile ? 'text-xs' : 'text-sm'}`}>{currentPhoto.caption}</p>
</div>
)}
</div>
</DialogContent>
</Dialog>