andika/membership-fe
3
1
Fork 1
Code Issues 17 Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor color scheme in member-related pages to use brand colors instead of CSS variables for consistency and improved readability

Browse Source
This commit is contained in:
kayela
2026-01-13 22:01:33 -06:00
parent 30d32d8823
commit e04d39fe17
61 changed files with 731 additions and 735 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/pages/members/MemberCalendar.js
View File

@@ -127,7 +127,7 @@ export default function MemberCalendar() {
<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" }}>
<p className="text-brand-purple " style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
Loading calendar...
</p>
</div>
@@ -144,7 +144,7 @@ export default function MemberCalendar() {
<h1 className="text-4xl font-semibold text-[var(--purple-ink)] mb-4" style={{ fontFamily: "'Inter', sans-serif" }}>
Event Calendar
</h1>
<p className="text-[var(--purple-lavender)] mb-6" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
<p className="text-brand-purple mb-6" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
View and manage your event RSVPs. Click on any event to see details and update your RSVP.
</p>
@@ -157,19 +157,19 @@ export default function MemberCalendar() {
<div className="flex gap-4 ml-auto">
<div className="flex items-center gap-2">
<div className="w-4 h-4 rounded bg-[var(--green-light)]"></div>
<span className="text-sm text-[var(--purple-lavender)]">Going</span>
<span className="text-sm text-brand-purple ">Going</span>
</div>
<div className="flex items-center gap-2">
<div className="w-4 h-4 rounded bg-[var(--orange-400)]"></div>
<span className="text-sm text-[var(--purple-lavender)]">Maybe</span>
<span className="text-sm text-brand-purple ">Maybe</span>
</div>
<div className="flex items-center gap-2">
<div className="w-4 h-4 rounded bg-[var(--slate-400)]"></div>
<span className="text-sm text-[var(--purple-lavender)]">Not Going</span>
<span className="text-sm text-brand-purple ">Not Going</span>
</div>
<div className="flex items-center gap-2">
<div className="w-4 h-4 rounded bg-[var(--neutral-800)]"></div>
<span className="text-sm text-[var(--purple-lavender)]">No RSVP</span>
<span className="text-sm text-brand-purple ">No RSVP</span>
</div>
</div>
</div>
@@ -201,7 +201,7 @@ export default function MemberCalendar() {
<DialogHeader>
<div className="flex items-center gap-3 mb-2">
<div className="bg-[var(--neutral-800)]/20 p-3 rounded-lg">
<CalendarIcon className="h-6 w-6 text-[var(--purple-lavender)]" />
<CalendarIcon className="h-6 w-6 text-brand-purple " />
</div>
{selectedEvent.user_rsvp_status && (
<Badge
@@ -225,7 +225,7 @@ export default function MemberCalendar() {
<div className="space-y-4 mt-4">
<div className="space-y-3">
<div className="flex items-center gap-3 text-[var(--purple-lavender)]">
<div className="flex items-center gap-3 text-brand-purple ">
<CalendarIcon className="h-5 w-5" />
<span style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
{new Date(selectedEvent.start_at).toLocaleDateString('en-US', {
@@ -236,17 +236,17 @@ export default function MemberCalendar() {
})}
</span>
</div>
<div className="flex items-center gap-3 text-[var(--purple-lavender)]">
<div className="flex items-center gap-3 text-brand-purple ">
<Clock className="h-5 w-5" />
<span style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
{new Date(selectedEvent.start_at).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })} - {new Date(selectedEvent.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-brand-purple ">
<MapPin className="h-5 w-5" />
<span style={{ fontFamily: "'Nunito Sans', sans-serif" }}>{selectedEvent.location}</span>
</div>
<div className="flex items-center gap-3 text-[var(--purple-lavender)]">
<div className="flex items-center gap-3 text-brand-purple ">
<Users className="h-5 w-5" />
<span style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
{selectedEvent.rsvp_count || 0} {selectedEvent.rsvp_count === 1 ? 'person' : 'people'} attending
@@ -260,7 +260,7 @@ export default function MemberCalendar() {
<h3 className="text-lg font-semibold text-[var(--purple-ink)] mb-2" style={{ fontFamily: "'Inter', sans-serif" }}>
About This Event
</h3>
<p className="text-[var(--purple-lavender)] leading-relaxed whitespace-pre-line" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
<p className="text-brand-purple leading-relaxed whitespace-pre-line" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
{selectedEvent.description}
</p>
</div>
@@ -290,7 +290,7 @@ export default function MemberCalendar() {
variant="outline"
className={`rounded-full px-6 flex items-center gap-2 border-2 ${selectedEvent.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-brand-purple text-brand-purple hover:bg-[var(--lavender-300)]'
}`}
>
<HelpCircle className="h-4 w-4" />