fix(ui): replace hardcoded gray/neutral classes

This commit is contained in:
ephraimduncan
2026-07-07 06:12:10 +00:00
parent 50f272be87
commit a3dc96e8c1
32 changed files with 62 additions and 60 deletions
@@ -127,8 +127,8 @@ export const AdminDashboardUsersTable = ({ users, totalPages, perPage, page }: A
</DataTable>
{isPending && (
<div className="absolute inset-0 flex items-center justify-center bg-white/50">
<Loader className="h-8 w-8 animate-spin text-gray-500" />
<div className="absolute inset-0 flex items-center justify-center bg-background/50">
<Loader className="h-8 w-8 animate-spin text-muted-foreground" />
</div>
)}
</div>
@@ -204,8 +204,8 @@ export const AdminOrganisationOverviewTable = ({
</DataTable>
{isPending && (
<div className="absolute inset-0 flex items-center justify-center bg-white/50">
<Loader className="h-8 w-8 animate-spin text-gray-500" />
<div className="absolute inset-0 flex items-center justify-center bg-background/50">
<Loader className="h-8 w-8 animate-spin text-muted-foreground" />
</div>
)}
</div>
@@ -110,7 +110,7 @@ export const AdminOrganisationsTable = ({
return (
<div
className={`inline-flex items-center rounded-full px-2 py-1 font-medium text-xs ${
isPaid ? 'bg-green-100 text-green-800' : 'bg-gray-100 text-gray-800'
isPaid ? 'bg-green-100 text-green-800' : 'bg-muted text-muted-foreground'
}`}
>
{isPaid ? (
@@ -253,8 +253,8 @@ export const OrganisationInsightsTable = ({
</div>
{isLoading && (
<div className="absolute inset-0 flex items-center justify-center bg-white/50">
<Loader className="h-8 w-8 animate-spin text-gray-500" />
<div className="absolute inset-0 flex items-center justify-center bg-background/50">
<Loader className="h-8 w-8 animate-spin text-muted-foreground" />
</div>
)}
</div>
@@ -72,7 +72,7 @@ export const SettingsPublicProfileTemplatesTable = () => {
return (
<div>
<div className="mt-6 divide-y divide-neutral-200 overflow-hidden rounded-lg border border-neutral-200 dark:divide-foreground/30 dark:border-foreground/30">
<div className="mt-6 divide-y divide-border overflow-hidden rounded-lg border border-border">
{/* Loading and error handling states. */}
{publicDirectTemplates.length === 0 && (
<>
@@ -132,7 +132,7 @@ export const SettingsPublicProfileTemplatesTable = () => {
<div>
<p className="break-all text-sm">{template.publicTitle}</p>
<p className="break-all text-neutral-400 text-xs">{template.publicDescription}</p>
<p className="break-all text-muted-foreground text-xs">{template.publicDescription}</p>
</div>
</div>
@@ -134,7 +134,7 @@ export const TemplatesTable = ({
</p>
</li>
<li>
<div className="mb-2 flex w-fit flex-row items-center rounded border border-neutral-300 bg-neutral-200 px-1.5 py-0.5 text-xs dark:border-neutral-500 dark:bg-neutral-600">
<div className="mb-2 flex w-fit flex-row items-center rounded border border-border bg-muted px-1.5 py-0.5 text-xs">
<Link2Icon className="mr-1 h-3 w-3" />
<Trans>direct link</Trans>
</div>
@@ -310,8 +310,8 @@ export const TemplatesTable = ({
</DataTable>
{isPending && (
<div className="absolute inset-0 flex items-center justify-center bg-white/50">
<Loader className="h-8 w-8 animate-spin text-gray-500" />
<div className="absolute inset-0 flex items-center justify-center bg-background/50">
<Loader className="h-8 w-8 animate-spin text-muted-foreground" />
</div>
)}
</div>