fix typo
This commit is contained in:
@@ -51,7 +51,7 @@ const EventDetails = () => {
|
||||
<div className="min-h-screen bg-background">
|
||||
<Navbar />
|
||||
<div className="flex items-center justify-center min-h-[60vh]">
|
||||
<p className="text-var(--purple-lavender)" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Loading event...</p>
|
||||
<p className="text-[var(--purple-lavender)]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Loading event...</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
@@ -68,23 +68,23 @@ const EventDetails = () => {
|
||||
<div className="max-w-4xl mx-auto px-6 py-12">
|
||||
<button
|
||||
onClick={() => navigate('/events')}
|
||||
className="inline-flex items-center text-var(--purple-lavender) hover:text-var(--orange-light) transition-colors mb-8"
|
||||
className="inline-flex items-center text-[var(--purple-lavender)] hover:text-[var(--orange-light)] transition-colors mb-8"
|
||||
data-testid="back-to-events-button"
|
||||
>
|
||||
<ArrowLeft className="h-4 w-4 mr-2" />
|
||||
Back to Events
|
||||
</button>
|
||||
|
||||
<Card className="p-8 md:p-12 bg-background rounded-2xl border border-var(--neutral-800) shadow-lg">
|
||||
<Card className="p-8 md:p-12 bg-background rounded-2xl border border-[var(--neutral-800)] shadow-lg">
|
||||
<div className="mb-8">
|
||||
<div className="flex items-center gap-4 mb-6">
|
||||
<div className="bg-var(--neutral-800)/20 p-4 rounded-xl">
|
||||
<Calendar className="h-10 w-10 text-var(--purple-lavender)" />
|
||||
<div className="bg-[var(--neutral-800)]/20 p-4 rounded-xl">
|
||||
<Calendar className="h-10 w-10 text-[var(--purple-lavender)]" />
|
||||
</div>
|
||||
{event.user_rsvp_status && (
|
||||
<Badge
|
||||
className={`px-4 py-2 rounded-full text-sm ${event.user_rsvp_status === 'yes'
|
||||
? 'bg-var(--green-light) text-white'
|
||||
? 'bg-[var(--green-light)] text-white'
|
||||
: event.user_rsvp_status === 'no'
|
||||
? 'bg-gray-400 text-white'
|
||||
: 'bg-orange-100 text-orange-700'
|
||||
@@ -97,12 +97,12 @@ const EventDetails = () => {
|
||||
)}
|
||||
</div>
|
||||
|
||||
<h1 className="text-4xl md:text-5xl font-semibold text-var(--purple-ink) mb-6" style={{ fontFamily: "'Inter', sans-serif" }}>
|
||||
<h1 className="text-4xl md:text-5xl font-semibold text-[var(--purple-ink)] mb-6" style={{ fontFamily: "'Inter', sans-serif" }}>
|
||||
{event.title}
|
||||
</h1>
|
||||
|
||||
<div className="space-y-4 text-lg">
|
||||
<div className="flex items-center gap-3 text-var(--purple-lavender)">
|
||||
<div className="flex items-center gap-3 text-[var(--purple-lavender)]">
|
||||
<Calendar className="h-5 w-5" />
|
||||
<span style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
|
||||
{new Date(event.start_at).toLocaleDateString('en-US', {
|
||||
@@ -113,18 +113,18 @@ const EventDetails = () => {
|
||||
})}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-3 text-var(--purple-lavender)">
|
||||
<div className="flex items-center gap-3 text-[var(--purple-lavender)]">
|
||||
<Calendar className="h-5 w-5" />
|
||||
<span style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
|
||||
{new Date(event.start_at).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })} -{' '}
|
||||
{new Date(event.end_at).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-3 text-var(--purple-lavender)">
|
||||
<div className="flex items-center gap-3 text-[var(--purple-lavender)]">
|
||||
<MapPin className="h-5 w-5" />
|
||||
<span style={{ fontFamily: "'Nunito Sans', sans-serif" }}>{event.location}</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-3 text-var(--purple-lavender)">
|
||||
<div className="flex items-center gap-3 text-[var(--purple-lavender)]">
|
||||
<Users className="h-5 w-5" />
|
||||
<span style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
|
||||
{event.rsvp_count || 0} {event.rsvp_count === 1 ? 'person' : 'people'} attending
|
||||
@@ -135,18 +135,18 @@ const EventDetails = () => {
|
||||
</div>
|
||||
|
||||
{event.description && (
|
||||
<div className="mb-8 pb-8 border-b border-var(--neutral-800)">
|
||||
<h2 className="text-2xl font-semibold text-var(--purple-ink) mb-4" style={{ fontFamily: "'Inter', sans-serif" }}>
|
||||
<div className="mb-8 pb-8 border-b border-[var(--neutral-800)]">
|
||||
<h2 className="text-2xl font-semibold text-[var(--purple-ink)] mb-4" style={{ fontFamily: "'Inter', sans-serif" }}>
|
||||
About This Event
|
||||
</h2>
|
||||
<p className="text-var(--purple-lavender) leading-relaxed whitespace-pre-line" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
|
||||
<p className="text-[var(--purple-lavender)] leading-relaxed whitespace-pre-line" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
|
||||
{event.description}
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div>
|
||||
<h2 className="text-2xl font-semibold text-var(--purple-ink) mb-6" style={{ fontFamily: "'Inter', sans-serif" }}>
|
||||
<h2 className="text-2xl font-semibold text-[var(--purple-ink)] mb-6" style={{ fontFamily: "'Inter', sans-serif" }}>
|
||||
RSVP to This Event
|
||||
</h2>
|
||||
<div className="flex gap-4 flex-wrap">
|
||||
@@ -154,8 +154,8 @@ const EventDetails = () => {
|
||||
onClick={() => handleRSVP('yes')}
|
||||
disabled={rsvpLoading}
|
||||
className={`rounded-full px-8 py-6 flex items-center gap-2 ${event.user_rsvp_status === 'yes'
|
||||
? 'bg-var(--green-light) text-white'
|
||||
: 'bg-var(--neutral-800) text-var(--purple-ink) hover:bg-background'
|
||||
? 'bg-[var(--green-light)] text-white'
|
||||
: 'bg-[var(--neutral-800)] text-[var(--purple-ink)] hover:bg-background'
|
||||
}`}
|
||||
data-testid="rsvp-yes-button"
|
||||
>
|
||||
@@ -168,7 +168,7 @@ const EventDetails = () => {
|
||||
variant="outline"
|
||||
className={`rounded-full px-8 py-6 flex items-center gap-2 border-2 ${event.user_rsvp_status === 'maybe'
|
||||
? 'border-orange-400 bg-orange-100 text-orange-700'
|
||||
: 'border-var(--purple-lavender) text-var(--purple-lavender) hover:bg-var(--lavender-300)'
|
||||
: 'border-[var(--purple-lavender)] text-[var(--purple-lavender)] hover:bg-[var(--lavender-300)]'
|
||||
}`}
|
||||
data-testid="rsvp-maybe-button"
|
||||
>
|
||||
@@ -191,11 +191,11 @@ const EventDetails = () => {
|
||||
</div>
|
||||
|
||||
{/* Add to Calendar Section */}
|
||||
<div className="mt-8 pt-8 border-t border-var(--neutral-800)">
|
||||
<h2 className="text-xl font-semibold text-var(--purple-ink) mb-4" style={{ fontFamily: "'Inter', sans-serif" }}>
|
||||
<div className="mt-8 pt-8 border-t border-[var(--neutral-800)]">
|
||||
<h2 className="text-xl font-semibold text-[var(--purple-ink)] mb-4" style={{ fontFamily: "'Inter', sans-serif" }}>
|
||||
Add to Your Calendar
|
||||
</h2>
|
||||
<p className="text-var(--purple-lavender) mb-4" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
|
||||
<p className="text-[var(--purple-lavender)] mb-4" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
|
||||
Never miss this event! Add it to your calendar app for reminders.
|
||||
</p>
|
||||
<AddToCalendarButton
|
||||
|
||||
Reference in New Issue
Block a user