Makes photo dialog clearer

This commit is contained in:
2026-05-18 23:58:37 -05:00
parent efab8b3083
commit 44a5805b2b
2 changed files with 10 additions and 9 deletions

View File

@@ -242,8 +242,8 @@
{@const hunt = sheetHunt}
{@const myTeam = sheetIsActive ? ongoingTeams[hunt.id] : upcomingTeams[hunt.id]}
<div class="fixed inset-0 z-40" onclick={closeSheet} role="presentation"></div>
<div class="fixed bottom-0 left-0 right-0 z-50 bg-base-100 rounded-t-2xl shadow-2xl max-h-[80vh] overflow-y-auto">
<div class="p-4 border-b border-base-200 flex items-center justify-between sticky top-0 bg-base-100">
<div class="fixed bottom-0 left-0 right-0 z-50 bg-base-200 rounded-t-2xl shadow-2xl max-h-[80vh] overflow-y-auto">
<div class="p-4 border-b border-base-300 flex items-center justify-between sticky top-0 bg-base-200">
<div>
<h3 class="font-bold text-lg">{hunt.title}</h3>
<p class="text-xs text-base-content/50">{formatDateTime(hunt.startDateTime)} {formatDateTime(hunt.endDateTime)}</p>
@@ -260,7 +260,7 @@
<LoadingSpinner />
{:else if myTeam}
<!-- Already on a team -->
<div class="rounded-xl border border-base-200 p-4 flex flex-col gap-3">
<div class="rounded-xl bg-base-100 border border-base-300 p-4 flex flex-col gap-3">
<div>
<p class="text-xs font-semibold uppercase tracking-wide text-base-content/40 mb-1">Your Team</p>
<p class="text-lg font-bold">{myTeam.name}</p>

View File

@@ -376,7 +376,7 @@
{#if teamMembersOpen && myTeam}
{@const team = myTeam}
<div class="fixed inset-0 z-50 flex items-center justify-center p-6" role="presentation" onclick={() => teamMembersOpen = false}>
<div class="bg-base-100 rounded-2xl shadow-2xl w-full max-w-sm p-5" role="dialog" aria-modal="true" onclick={(e) => e.stopPropagation()}>
<div class="bg-base-200 rounded-2xl shadow-2xl w-full max-w-sm p-5" role="dialog" aria-modal="true" onclick={(e) => e.stopPropagation()}>
<div class="flex items-center justify-between mb-4">
<div>
<p class="text-xs font-semibold uppercase tracking-wide text-base-content/40">Team</p>
@@ -435,13 +435,13 @@
<!-- Item detail bottom sheet -->
{#if selectedItem}
<div class="fixed inset-0 z-40" onclick={closeSheet} role="presentation"></div>
<div class="fixed bottom-0 left-0 right-0 z-50 bg-base-100 rounded-t-2xl shadow-2xl max-h-[80vh] overflow-y-auto">
<div class="p-4 border-b border-base-200 flex items-center justify-between sticky top-0 bg-base-100">
<div class="fixed bottom-0 left-0 right-0 z-50 bg-base-200 rounded-t-2xl shadow-2xl max-h-[80vh] overflow-y-auto">
<div class="p-4 border-b border-base-300 flex items-center justify-between sticky top-0 bg-base-200">
<div>
<h3 class="font-bold text-lg">{selectedItem.name}</h3>
<p class="text-xs text-base-content/50">{selectedItem.points} points</p>
</div>
<button class="btn btn-ghost btn-sm btn-circle" onclick={closeSheet}></button>
<button class="btn btn-outline btn-sm" onclick={closeSheet}>Done</button>
</div>
<div class="p-4 flex flex-col gap-4">
{#if submitting}
@@ -494,9 +494,9 @@
{:else if itemPhotos.filter(p => p.photoStatus !== 'REMOVED').length > 0}
<div class="flex flex-col gap-3">
{#each itemPhotos.filter(p => p.photoStatus !== 'REMOVED') as photo (photo.id)}
<div class="card bg-base-200 overflow-hidden">
<div class="card bg-base-100 overflow-hidden">
<button class="w-full cursor-zoom-in" onclick={() => expandedPhoto = photo}>
<AuthImage photoId={photo.id} version="SMALL" alt={photo.hunterName} class="w-full h-48 object-cover" />
<AuthImage photoId={photo.id} version="SMALL" alt={photo.hunterName} class="w-full max-h-64 object-contain bg-base-300" />
</button>
<div class="p-3 flex items-center justify-between">
<div>
@@ -513,6 +513,7 @@
{:else}
<p class="text-center text-base-content/50 py-4 text-sm">No photos submitted yet</p>
{/if}
</div>
</div>
{/if}