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

dev #19

Merged
andika merged 24 commits from dev into loaf-prod 2026-01-26 11:22:19 +00:00
Conversation 0 Commits 24 Files Changed 99 +25 -33
8 changed files with 25 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 0ebfe71361 - Show all commits

2
src/components/AddToCalendarButton.js
View File

@@ -117,7 +117,7 @@ export default function AddToCalendarButton({
return ( return (
<DropdownMenu open={isOpen} onOpenChange={setIsOpen}> <DropdownMenu open={isOpen} onOpenChange={setIsOpen}>
<DropdownMenuTrigger asChild> <DropdownMenuTrigger asChild>
<Button variant={variant} size={size} className="gap-2"> <Button variant={variant} size={size} className="bg-[var(--purple-lavender)] text-white hover:bg-[var(--purple-muted)] rounded-full gap-2 dark:hover:bg-brand-lavender dark:hover:text-brand-dark-lavender">
<Calendar className="h-4 w-4" /> <Calendar className="h-4 w-4" />
Add to Calendar Add to Calendar
<ChevronDown className="h-4 w-4" /> <ChevronDown className="h-4 w-4" />

15
src/components/Navbar.js
View File

@@ -39,7 +39,7 @@ const Navbar = () => {
style={{ fontFamily: "'Poppins', sans-serif" }} style={{ fontFamily: "'Poppins', sans-serif" }}
data-testid="admin-nav-button" data-testid="admin-nav-button"
> >
Admin Panel Dashboard
</button> </button>
</Link> </Link>
)} )}
@@ -110,7 +110,7 @@ const Navbar = () => {
className="text-white text-[17.5px] font-medium hover:opacity-80 transition-opacity" className="text-white text-[17.5px] font-medium hover:opacity-80 transition-opacity"
style={{ fontFamily: "'Poppins', sans-serif" }} style={{ fontFamily: "'Poppins', sans-serif" }}
> >
Dashboard My Profile
</Link> </Link>
<Link <Link
to="/events" to="/events"
@@ -170,14 +170,7 @@ const Navbar = () => {
</DropdownMenuItem> </DropdownMenuItem>
</DropdownMenuContent> </DropdownMenuContent>
</DropdownMenu> </DropdownMenu>
<Link
to="/profile"
className="text-white text-[17.5px] font-medium hover:opacity-80 transition-opacity"
style={{ fontFamily: "'Poppins', sans-serif" }}
data-testid="profile-nav-button"
>
Profile
</Link>
</nav> </nav>
{/* Mobile Hamburger Button */} {/* Mobile Hamburger Button */}
@@ -373,7 +366,7 @@ const Navbar = () => {
className="w-full bg-background/20 hover:bg-background/30 text-white rounded-lg" className="w-full bg-background/20 hover:bg-background/30 text-white rounded-lg"
style={{ fontFamily: "'Poppins', sans-serif" }} style={{ fontFamily: "'Poppins', sans-serif" }}
> >
Admin Panel Dashboard
</Button> </Button>
</Link> </Link>
)} )}

4
src/components/PublicNavbar.js
View File

@@ -165,7 +165,7 @@ const PublicNavbar = () => {
className={getDesktopLinkClasses(user ? "/dashboard" : "/become-a-member")} className={getDesktopLinkClasses(user ? "/dashboard" : "/become-a-member")}
style={{ fontFamily: "'Nunito Sans', sans-serif" }} style={{ fontFamily: "'Nunito Sans', sans-serif" }}
> >
{user ? 'Dashboard' : 'Become a Member'} {user ? 'My Profile' : 'Become a Member'}
</Link> </Link>
{!user && ( {!user && (
<Link <Link
@@ -270,7 +270,7 @@ const PublicNavbar = () => {
className={getMobileLinkClasses(user ? "/dashboard" : "/become-a-member")} className={getMobileLinkClasses(user ? "/dashboard" : "/become-a-member")}
style={{ fontFamily: "'Nunito Sans', sans-serif" }} style={{ fontFamily: "'Nunito Sans', sans-serif" }}
> >
{user ? 'Dashboard' : 'Become a Member'} {user ? 'My Profile' : 'Become a Member'}
</Link> </Link>
{!user && ( {!user && (

4
src/components/ui/dropdown-menu.jsx
View File

@@ -20,7 +20,7 @@ const DropdownMenuSubTrigger = React.forwardRef(({ className, inset, children, .
<DropdownMenuPrimitive.SubTrigger <DropdownMenuPrimitive.SubTrigger
ref={ref} ref={ref}
className={cn( className={cn(
"flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0", "flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-brand-light-lavender data-[state=open]:bg-accent [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
inset && "pl-8", inset && "pl-8",
className className
)} )}
@@ -63,7 +63,7 @@ const DropdownMenuItem = React.forwardRef(({ className, inset, ...props }, ref)
<DropdownMenuPrimitive.Item <DropdownMenuPrimitive.Item
ref={ref} ref={ref}
className={cn( className={cn(
"relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0", "relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-brand-light-lavender focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0",
inset && "pl-8", inset && "pl-8",
className className
)} )}

9
src/pages/Dashboard.js
View File

@@ -168,11 +168,11 @@ const Dashboard = () => {
</div> </div>
<Link to="/profile"> <Link to="/profile">
<Button <Button
className="bg-[var(--neutral-800)] text-[var(--purple-ink)] hover:bg-background rounded-full px-6" className="btn-lavender"
data-testid="view-profile-button" data-testid="view-profile-button"
> >
<User className="h-4 w-4 mr-2" /> <User className="h-4 w-4 mr-2" />
View Profile Edit Profile
</Button> </Button>
</Link> </Link>
</div> </div>
@@ -227,8 +227,7 @@ const Dashboard = () => {
</h3> </h3>
<Link to="/events"> <Link to="/events">
<Button <Button
variant="ghost" className="btn-lavender "
className="text-[var(--orange-light)] hover:text-brand-purple "
data-testid="view-all-events-button" data-testid="view-all-events-button"
> >
View All View All
@@ -442,7 +441,7 @@ const Dashboard = () => {
Browse upcoming events and RSVP to start building your event history! Browse upcoming events and RSVP to start building your event history!
</p> </p>
<Link to="/events"> <Link to="/events">
<Button className="bg-[var(--neutral-800)] text-[var(--purple-ink)] hover:bg-background rounded-full px-6"> <Button className="bg-[var(--purple-lavender)] text-white hover:bg-[var(--purple-muted)] rounded-full dark:hover:bg-brand-lavender dark:hover:text-brand-dark-lavender px-6">
<Calendar className="h-4 w-4 mr-2" /> <Calendar className="h-4 w-4 mr-2" />
Browse Events Browse Events
</Button> </Button>

2
src/pages/EventDetails.js
View File

@@ -155,7 +155,7 @@ const EventDetails = () => {
disabled={rsvpLoading} disabled={rsvpLoading}
className={`rounded-full px-8 py-6 flex items-center gap-2 ${event.user_rsvp_status === 'yes' 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(--green-light)] text-white'
: 'bg-[var(--neutral-800)] text-[var(--purple-ink)] hover:bg-background' : 'bg-[var(--neutral-800)] text-[var(--purple-ink)] hover:bg-brand-lavender'
}`} }`}
data-testid="rsvp-yes-button" data-testid="rsvp-yes-button"
> >

18
src/pages/admin/AdminEventAttendance.js
View File

@@ -254,7 +254,7 @@ const AdminEventAttendance = () => {
</div> </div>
<Button <Button
onClick={exportToCSV} onClick={exportToCSV}
className="bg-[var(--green-light)] hover:bg-[var(--green-eucalyptus)] text-white rounded-xl" className="bg-[var(--green-light)] hover:bg-[var(--green-eucalyptus)] dark:bg-[var(--green-forest)] text-white rounded-xl"
style={{ fontFamily: "'Inter', sans-serif" }} style={{ fontFamily: "'Inter', sans-serif" }}
> >
<Download className="h-4 w-4 mr-2" /> <Download className="h-4 w-4 mr-2" />
@@ -282,7 +282,7 @@ const AdminEventAttendance = () => {
)} )}
</div> </div>
</div> </div>
<Badge className={`${event.published ? 'bg-[var(--green-light)]' : 'bg-[var(--neutral-800)]'} text-white px-3 py-1`}> <Badge className={`${event.published ? 'bg-[var(--green-light)] dark:bg-[var(--green-forest)]' : 'bg-[var(--neutral-800)]'} text-white px-3 py-1`}>
{event.published ? 'Published' : 'Draft'} {event.published ? 'Published' : 'Draft'}
</Badge> </Badge>
</div> </div>
@@ -302,7 +302,7 @@ const AdminEventAttendance = () => {
<Card className="p-4 bg-background border-[var(--neutral-800)] rounded-xl"> <Card className="p-4 bg-background border-[var(--neutral-800)] rounded-xl">
<div className="flex items-center gap-3"> <div className="flex items-center gap-3">
<UserCheck className="h-8 w-8 text-[var(--green-light)]" /> <UserCheck className="h-8 w-8 text-[var(--green-light)] dark:text-[var(--green-forest)]" />
<div> <div>
<p className="text-sm text-brand-purple " style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Yes</p> <p className="text-sm text-brand-purple " style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Yes</p>
<p className="text-2xl font-semibold text-[var(--purple-ink)]" style={{ fontFamily: "'Inter', sans-serif" }}>{stats.yesCount}</p> <p className="text-2xl font-semibold text-[var(--purple-ink)]" style={{ fontFamily: "'Inter', sans-serif" }}>{stats.yesCount}</p>
@@ -350,7 +350,7 @@ const AdminEventAttendance = () => {
onClick={() => setActiveTab('all')} onClick={() => setActiveTab('all')}
variant={activeTab === 'all' ? 'default' : 'outline'} variant={activeTab === 'all' ? 'default' : 'outline'}
className={`rounded-xl ${activeTab === 'all' className={`rounded-xl ${activeTab === 'all'
? 'bg-brand-purple hover:bg-[var(--purple-ink)] text-white' ? 'bg-brand-purple hover:bg-[var(--purple-ink)] dark:bg-brand-dark-lavender text-white'
: 'border-[var(--neutral-800)] text-brand-purple hover:bg-[var(--lavender-500)]' : 'border-[var(--neutral-800)] text-brand-purple hover:bg-[var(--lavender-500)]'
}`} }`}
style={{ fontFamily: "'Inter', sans-serif" }} style={{ fontFamily: "'Inter', sans-serif" }}
@@ -361,7 +361,7 @@ const AdminEventAttendance = () => {
onClick={() => setActiveTab('yes')} onClick={() => setActiveTab('yes')}
variant={activeTab === 'yes' ? 'default' : 'outline'} variant={activeTab === 'yes' ? 'default' : 'outline'}
className={`rounded-xl ${activeTab === 'yes' className={`rounded-xl ${activeTab === 'yes'
? 'bg-[var(--green-light)] hover:bg-[var(--green-eucalyptus)] text-white' ? 'bg-[var(--green-light)] hover:bg-[var(--green-eucalyptus)] dark:bg-[var(--green-forest)] text-white'
: 'border-[var(--neutral-800)] text-brand-purple hover:bg-[var(--lavender-500)]' : 'border-[var(--neutral-800)] text-brand-purple hover:bg-[var(--lavender-500)]'
}`} }`}
style={{ fontFamily: "'Inter', sans-serif" }} style={{ fontFamily: "'Inter', sans-serif" }}
@@ -383,7 +383,7 @@ const AdminEventAttendance = () => {
onClick={() => setActiveTab('maybe')} onClick={() => setActiveTab('maybe')}
variant={activeTab === 'maybe' ? 'default' : 'outline'} variant={activeTab === 'maybe' ? 'default' : 'outline'}
className={`rounded-xl ${activeTab === 'maybe' className={`rounded-xl ${activeTab === 'maybe'
? 'bg-[var(--gold-warm)] hover:bg-[var(--gold-soft)] text-[var(--purple-ink)]' ? 'bg-[var(--gold-warm)] dark:bg-orange-400 hover:bg-[var(--gold-soft)] text-white'
: 'border-[var(--neutral-800)] text-brand-purple hover:bg-[var(--lavender-500)]' : 'border-[var(--neutral-800)] text-brand-purple hover:bg-[var(--lavender-500)]'
}`} }`}
style={{ fontFamily: "'Inter', sans-serif" }} style={{ fontFamily: "'Inter', sans-serif" }}
@@ -483,7 +483,7 @@ const AdminEventAttendance = () => {
<td className="px-4 py-3"> <td className="px-4 py-3">
<Badge <Badge
className={`${rsvp.rsvp_status === 'yes' className={`${rsvp.rsvp_status === 'yes'
? 'bg-[var(--green-light)]' ? 'bg-[var(--green-light)] dark:bg-[var(--green-forest)]'
: rsvp.rsvp_status === 'no' : rsvp.rsvp_status === 'no'
? 'bg-[var(--orange-soft)]' ? 'bg-[var(--orange-soft)]'
: 'bg-[var(--gold-warm)] text-[var(--purple-ink)]' : 'bg-[var(--gold-warm)] text-[var(--purple-ink)]'
@@ -498,7 +498,7 @@ const AdminEventAttendance = () => {
onClick={() => handleIndividualAttendance(rsvp.user_id, false)} onClick={() => handleIndividualAttendance(rsvp.user_id, false)}
disabled={saving} disabled={saving}
size="sm" size="sm"
className="bg-[var(--green-light)] hover:bg-[var(--green-eucalyptus)] text-white rounded-lg min-w-[120px]" className="bg-[var(--green-light)] dark:bg-[var(--green-forest)] hover:bg-[var(--green-eucalyptus)] text-white rounded-lg min-w-[120px]"
style={{ fontFamily: "'Inter', sans-serif" }} style={{ fontFamily: "'Inter', sans-serif" }}
> >
<Check className="h-3 w-3 mr-1" /> <Check className="h-3 w-3 mr-1" />
@@ -510,7 +510,7 @@ const AdminEventAttendance = () => {
disabled={saving} disabled={saving}
size="sm" size="sm"
variant="outline" variant="outline"
className="border-[var(--neutral-800)] text-brand-purple hover:bg-[var(--green-light)] hover:text-white hover:border-[var(--green-light)] rounded-lg min-w-[120px]" className="border-[var(--neutral-800)] text-brand-purple hover:bg-[var(--green-light)] dark:bg-[var(--green-forest)] hover:text-white hover:border-[var(--green-light)] dark:bg-[var(--green-forest)] rounded-lg min-w-[120px]"
style={{ fontFamily: "'Inter', sans-serif" }} style={{ fontFamily: "'Inter', sans-serif" }}
> >
<X className="h-3 w-3 mr-1" /> <X className="h-3 w-3 mr-1" />

2
src/pages/members/NewsletterArchive.js
View File

@@ -128,7 +128,7 @@ export default function NewsletterArchive() {
onClick={clearFilter} onClick={clearFilter}
variant={selectedYear === null ? "default" : "outline"} variant={selectedYear === null ? "default" : "outline"}
size="sm" size="sm"
className={selectedYear === null ? "bg-brand-purple text-white" : "border-brand-purple text-brand-purple "} className={selectedYear === null ? "bg-brand-purple hover:bg-[var(--purple-muted)] text-white" : "border-brand-lavender text-brand-lavender "}
> >
All Years All Years
</Button> </Button>