refactor: update styles in MembersDirectory and NewsletterArchive for consistency and improved theming

- Updated color classes to use CSS variables for better maintainability and theming.
- Refactored component styles in MembersDirectory.js to enhance visual consistency.
- Adjusted loading states and empty states in NewsletterArchive.js for improved user experience.
- Added new brand colors to tailwind.config.js for future use.
This commit is contained in:
2026-01-12 20:10:33 -06:00
parent a93e2aa863
commit 7694532d53
77 changed files with 2519 additions and 2338 deletions

View File

@@ -128,7 +128,7 @@ export default function AddToCalendarButton({
{event && (
<>
{/* Single Event Export Options */}
<div className="px-2 py-1.5 text-sm font-semibold text-[#422268]">
<div className="px-2 py-1.5 text-sm font-semibold text-var(--purple-ink)">
Add This Event
</div>
@@ -137,7 +137,7 @@ export default function AddToCalendarButton({
className="cursor-pointer"
>
<svg className="h-4 w-4 mr-2" viewBox="0 0 24 24" fill="currentColor">
<path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 17.93c-3.95-.49-7-3.85-7-7.93 0-.62.08-1.21.21-1.79L9 15v1c0 1.1.9 2 2 2v1.93zm6.9-2.54c-.26-.81-1-1.39-1.9-1.39h-1v-3c0-.55-.45-1-1-1H8v-2h2c.55 0 1-.45 1-1V7h2c1.1 0 2-.9 2-2v-.41c2.93 1.19 5 4.06 5 7.41 0 2.08-.8 3.97-2.1 5.39z"/>
<path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 17.93c-3.95-.49-7-3.85-7-7.93 0-.62.08-1.21.21-1.79L9 15v1c0 1.1.9 2 2 2v1.93zm6.9-2.54c-.26-.81-1-1.39-1.9-1.39h-1v-3c0-.55-.45-1-1-1H8v-2h2c.55 0 1-.45 1-1V7h2c1.1 0 2-.9 2-2v-.41c2.93 1.19 5 4.06 5 7.41 0 2.08-.8 3.97-2.1 5.39z" />
</svg>
Google Calendar
</DropdownMenuItem>
@@ -147,7 +147,7 @@ export default function AddToCalendarButton({
className="cursor-pointer"
>
<svg className="h-4 w-4 mr-2" viewBox="0 0 24 24" fill="currentColor">
<path d="M7 2h14v20H7V2zm7 11c0 2.761-2.239 5-5 5H2c-.552 0-1-.448-1-1s.448-1 1-1h7c1.657 0 3-1.343 3-3V9c0-1.657-1.343-3-3-3H2c-.552 0-1-.448-1-1s.448-1 1-1h7c2.761 0 5 2.239 5 5v4z"/>
<path d="M7 2h14v20H7V2zm7 11c0 2.761-2.239 5-5 5H2c-.552 0-1-.448-1-1s.448-1 1-1h7c1.657 0 3-1.343 3-3V9c0-1.657-1.343-3-3-3H2c-.552 0-1-.448-1-1s.448-1 1-1h7c2.761 0 5 2.239 5 5v4z" />
</svg>
Outlook Web
</DropdownMenuItem>
@@ -157,7 +157,7 @@ export default function AddToCalendarButton({
className="cursor-pointer"
>
<svg className="h-4 w-4 mr-2" viewBox="0 0 24 24" fill="currentColor">
<path d="M17.05 20.28c-.98.95-2.05.8-3.08.35-1.09-.46-2.09-.48-3.24 0-1.44.62-2.2.44-3.06-.35C2.79 15.25 3.51 7.59 9.05 7.31c1.35.07 2.29.74 3.08.8 1.18-.24 2.31-.93 3.57-.84 1.51.12 2.65.72 3.4 1.8-3.12 1.87-2.38 5.98.48 7.13-.57 1.5-1.31 2.99-2.54 4.09l.01-.01zM12.03 7.25c-.15-2.23 1.66-4.07 3.74-4.25.29 2.58-2.34 4.5-3.74 4.25z"/>
<path d="M17.05 20.28c-.98.95-2.05.8-3.08.35-1.09-.46-2.09-.48-3.24 0-1.44.62-2.2.44-3.06-.35C2.79 15.25 3.51 7.59 9.05 7.31c1.35.07 2.29.74 3.08.8 1.18-.24 2.31-.93 3.57-.84 1.51.12 2.65.72 3.4 1.8-3.12 1.87-2.38 5.98.48 7.13-.57 1.5-1.31 2.99-2.54 4.09l.01-.01zM12.03 7.25c-.15-2.23 1.66-4.07 3.74-4.25.29 2.58-2.34 4.5-3.74 4.25z" />
</svg>
Apple Calendar
</DropdownMenuItem>
@@ -177,7 +177,7 @@ export default function AddToCalendarButton({
{showSubscribe && (
<>
{/* Subscription Options */}
<div className="px-2 py-1.5 text-sm font-semibold text-[#422268]">
<div className="px-2 py-1.5 text-sm font-semibold text-var(--purple-ink)">
Calendar Feeds
</div>
@@ -187,7 +187,7 @@ export default function AddToCalendarButton({
>
<RefreshCw className="h-4 w-4 mr-2" />
Subscribe to My Events
<div className="text-xs text-[#664fa3] mt-0.5">
<div className="text-xs text-var(--purple-lavender) mt-0.5">
Auto-syncs your RSVP'd events
</div>
</DropdownMenuItem>
@@ -198,7 +198,7 @@ export default function AddToCalendarButton({
>
<Download className="h-4 w-4 mr-2" />
Download All Events
<div className="text-xs text-[#664fa3] mt-0.5">
<div className="text-xs text-var(--purple-lavender) mt-0.5">
One-time import of all upcoming events
</div>
</DropdownMenuItem>
@@ -206,7 +206,7 @@ export default function AddToCalendarButton({
)}
{!event && !showSubscribe && (
<div className="px-2 py-6 text-center text-sm text-[#664fa3]">
<div className="px-2 py-6 text-center text-sm text-var(--purple-lavender)">
No event selected
</div>
)}