This commit is contained in:
2026-01-12 20:37:38 -06:00
parent 7694532d53
commit 9c2d516f9d
74 changed files with 1842 additions and 1842 deletions

View File

@@ -107,11 +107,11 @@ const EventGallery = () => {
const EventCard = ({ event }) => (
<Card
className="p-6 bg-background rounded-2xl border border-var(--neutral-800) hover:shadow-lg hover:-translate-y-1 transition-all cursor-pointer h-full"
className="p-6 bg-background rounded-2xl border border-[var(--neutral-800)] hover:shadow-lg hover:-translate-y-1 transition-all cursor-pointer h-full"
onClick={() => handleEventClick(event)}
>
{/* Thumbnail */}
<div className="relative h-48 mb-4 rounded-xl overflow-hidden bg-var(--lavender-500)">
<div className="relative h-48 mb-4 rounded-xl overflow-hidden bg-[var(--lavender-500)]">
{event.thumbnail_url ? (
<img
src={event.thumbnail_url}
@@ -120,35 +120,35 @@ const EventGallery = () => {
/>
) : (
<div className="w-full h-full flex items-center justify-center">
<ImageIcon className="h-16 w-16 text-var(--neutral-800)" />
<ImageIcon className="h-16 w-16 text-[var(--neutral-800)]" />
</div>
)}
<div className="absolute top-3 right-3">
<Badge className="bg-var(--purple-lavender) text-white px-3 py-1 rounded-full">
<Badge className="bg-[var(--purple-lavender)] text-white px-3 py-1 rounded-full">
{event.gallery_count} {event.gallery_count === 1 ? 'photo' : 'photos'}
</Badge>
</div>
</div>
{/* Event Info */}
<h3 className="text-xl font-semibold text-var(--purple-ink) mb-2" style={{ fontFamily: "'Inter', sans-serif" }}>
<h3 className="text-xl font-semibold text-[var(--purple-ink)] mb-2" style={{ fontFamily: "'Inter', sans-serif" }}>
{event.title}
</h3>
{event.description && (
<p className="text-var(--purple-lavender) mb-3 line-clamp-2" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
<p className="text-[var(--purple-lavender)] mb-3 line-clamp-2" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
{event.description}
</p>
)}
<div className="space-y-2 text-sm">
<div className="flex items-center gap-2 text-var(--purple-lavender)">
<div className="flex items-center gap-2 text-[var(--purple-lavender)]">
<Calendar className="h-4 w-4" />
<span style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
{moment(event.start_at).format('MMMM D, YYYY')}
</span>
</div>
<div className="flex items-center gap-2 text-var(--purple-lavender)">
<div className="flex items-center gap-2 text-[var(--purple-lavender)]">
<MapPin className="h-4 w-4" />
<span style={{ fontFamily: "'Nunito Sans', sans-serif" }}>{event.location}</span>
</div>
@@ -165,10 +165,10 @@ const EventGallery = () => {
<div className="max-w-7xl mx-auto px-6 py-12">
{/* Header */}
<div className="mb-8">
<h1 className="text-4xl md:text-5xl font-semibold text-var(--purple-ink) mb-4" style={{ fontFamily: "'Inter', sans-serif" }}>
<h1 className="text-4xl md:text-5xl font-semibold text-[var(--purple-ink)] mb-4" style={{ fontFamily: "'Inter', sans-serif" }}>
Event Gallery
</h1>
<p className="text-lg text-var(--purple-lavender)" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
<p className="text-lg text-[var(--purple-lavender)]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
Browse photos from past LOAF events.
</p>
</div>
@@ -176,7 +176,7 @@ const EventGallery = () => {
{/* Events Grid */}
{loading ? (
<div className="text-center py-20">
<p className="text-var(--purple-lavender)" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Loading galleries...</p>
<p className="text-[var(--purple-lavender)]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Loading galleries...</p>
</div>
) : events.length > 0 ? (
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
@@ -186,11 +186,11 @@ const EventGallery = () => {
</div>
) : (
<div className="text-center py-20">
<ImageIcon className="h-20 w-20 text-var(--neutral-800) mx-auto mb-6" />
<h3 className="text-2xl font-semibold text-var(--purple-ink) mb-4" style={{ fontFamily: "'Inter', sans-serif" }}>
<ImageIcon className="h-20 w-20 text-[var(--neutral-800)] mx-auto mb-6" />
<h3 className="text-2xl font-semibold text-[var(--purple-ink)] mb-4" style={{ fontFamily: "'Inter', sans-serif" }}>
No Event Galleries Yet
</h3>
<p className="text-var(--purple-lavender)" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
<p className="text-[var(--purple-lavender)]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
Event photos will appear here once admins upload them.
</p>
</div>
@@ -210,7 +210,7 @@ const EventGallery = () => {
<Button
onClick={handleBackToEvents}
variant="ghost"
className="mb-6 text-var(--purple-lavender) hover:text-var(--purple-ink) hover:bg-var(--lavender-500)"
className="mb-6 text-[var(--purple-lavender)] hover:text-[var(--purple-ink)] hover:bg-[var(--lavender-500)]"
style={{ fontFamily: "'Inter', sans-serif" }}
>
<ArrowLeft className="h-4 w-4 mr-2" />
@@ -219,10 +219,10 @@ const EventGallery = () => {
{/* Event Header */}
<div className="mb-8">
<h1 className="text-4xl md:text-5xl font-semibold text-var(--purple-ink) mb-4" style={{ fontFamily: "'Inter', sans-serif" }}>
<h1 className="text-4xl md:text-5xl font-semibold text-[var(--purple-ink)] mb-4" style={{ fontFamily: "'Inter', sans-serif" }}>
{selectedEvent.title}
</h1>
<div className="flex flex-wrap gap-4 text-var(--purple-lavender)">
<div className="flex flex-wrap gap-4 text-[var(--purple-lavender)]">
<div className="flex items-center gap-2">
<Calendar className="h-5 w-5" />
<span style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
@@ -233,7 +233,7 @@ const EventGallery = () => {
<MapPin className="h-5 w-5" />
<span style={{ fontFamily: "'Nunito Sans', sans-serif" }}>{selectedEvent.location}</span>
</div>
<Badge className="bg-var(--purple-lavender) text-white px-3 py-1 rounded-full">
<Badge className="bg-[var(--purple-lavender)] text-white px-3 py-1 rounded-full">
{selectedEvent.gallery_count} {selectedEvent.gallery_count === 1 ? 'photo' : 'photos'}
</Badge>
</div>
@@ -242,7 +242,7 @@ const EventGallery = () => {
{/* Gallery Grid */}
{galleryLoading ? (
<div className="text-center py-20">
<p className="text-var(--purple-lavender)" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Loading images...</p>
<p className="text-[var(--purple-lavender)]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Loading images...</p>
</div>
) : galleryImages.length > 0 ? (
<div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
@@ -272,11 +272,11 @@ const EventGallery = () => {
</div>
) : (
<div className="text-center py-20">
<ImageIcon className="h-20 w-20 text-var(--neutral-800) mx-auto mb-6" />
<h3 className="text-2xl font-semibold text-var(--purple-ink) mb-4" style={{ fontFamily: "'Inter', sans-serif" }}>
<ImageIcon className="h-20 w-20 text-[var(--neutral-800)] mx-auto mb-6" />
<h3 className="text-2xl font-semibold text-[var(--purple-ink)] mb-4" style={{ fontFamily: "'Inter', sans-serif" }}>
No Photos Yet
</h3>
<p className="text-var(--purple-lavender)" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
<p className="text-[var(--purple-lavender)]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
Photos from this event will appear here once uploaded.
</p>
</div>