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

This commit is contained in:
2026-01-13 22:01:33 -06:00
parent 30d32d8823
commit e04d39fe17
61 changed files with 731 additions and 735 deletions

View File

@@ -73,7 +73,7 @@ const PendingInvitationsTable = () => {
const getRoleBadge = (role) => {
const config = {
superadmin: { label: 'Superadmin', className: 'bg-[var(--purple-lavender)] text-white' },
superadmin: { label: 'Superadmin', className: 'bg-brand-purple text-white' },
admin: { label: 'Admin', className: 'bg-[var(--green-light)] text-white' },
member: { label: 'Member', className: 'bg-[var(--neutral-800)] text-[var(--purple-ink)]' }
};
@@ -111,7 +111,7 @@ const PendingInvitationsTable = () => {
if (loading) {
return (
<div className="text-center py-8">
<p className="text-[var(--purple-lavender)]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
<p className="text-brand-purple " style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
Loading invitations...
</p>
</div>
@@ -125,7 +125,7 @@ const PendingInvitationsTable = () => {
<h3 className="text-xl font-semibold text-[var(--purple-ink)] mb-2" style={{ fontFamily: "'Inter', sans-serif" }}>
No Pending Invitations
</h3>
<p className="text-[var(--purple-lavender)]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
<p className="text-brand-purple " style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
All invitations have been accepted or expired
</p>
</Card>
@@ -152,19 +152,19 @@ const PendingInvitationsTable = () => {
<TableCell className="font-medium text-[var(--purple-ink)]">
{invitation.email}
</TableCell>
<TableCell className="text-[var(--purple-lavender)]">
<TableCell className="text-brand-purple ">
{invitation.first_name && invitation.last_name
? `${invitation.first_name} ${invitation.last_name}`
: '-'}
</TableCell>
<TableCell>{getRoleBadge(invitation.role)}</TableCell>
<TableCell className="text-[var(--purple-lavender)]">
<TableCell className="text-brand-purple ">
{new Date(invitation.invited_at).toLocaleDateString()}
</TableCell>
<TableCell>
<div className="flex items-center gap-2">
<Clock className={`h-4 w-4 ${isExpiringSoon(invitation.expires_at) ? 'text-orange-500' : 'text-[var(--purple-lavender)]'}`} />
<span className={`text-sm ${isExpiringSoon(invitation.expires_at) ? 'text-orange-500 font-semibold' : 'text-[var(--purple-lavender)]'}`}>
<Clock className={`h-4 w-4 ${isExpiringSoon(invitation.expires_at) ? 'text-orange-500' : 'text-brand-purple '}`} />
<span className={`text-sm ${isExpiringSoon(invitation.expires_at) ? 'text-orange-500 font-semibold' : 'text-brand-purple '}`}>
{formatDate(invitation.expires_at)}
</span>
</div>
@@ -211,7 +211,7 @@ const PendingInvitationsTable = () => {
<AlertDialogTitle className="text-2xl text-[var(--purple-ink)]" style={{ fontFamily: "'Inter', sans-serif" }}>
Revoke Invitation
</AlertDialogTitle>
<AlertDialogDescription className="text-[var(--purple-lavender)]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
<AlertDialogDescription className="text-brand-purple " style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
Are you sure you want to revoke the invitation for{' '}
<span className="font-semibold">{revokeDialog.invitation?.email}</span>?
This action cannot be undone.