fix: use semantic colors across admin pages

This commit is contained in:
2026-07-12 18:50:45 +02:00
parent 0fe482009c
commit 84e4123f09
83 changed files with 466 additions and 455 deletions
@@ -943,7 +943,7 @@ export function CatalogItemsTable({
{/* Unsaved changes banner */}
{hasUnsavedChanges && (
<div className="flex items-center gap-2 rounded-md border border-[var(--color-warning-border)] bg-[var(--color-warning-subtle)] px-3 py-2 text-sm text-[var(--color-warning-text-readable)]">
<div className="flex items-center gap-2 rounded-md border border-[var(--admin-warning-border)] bg-[var(--admin-warning-subtle)] px-3 py-2 text-sm text-[var(--admin-warning)]">
<span className="flex-1">
You have unsaved changes (
{modifiedItems.length > 0 ? `${modifiedItems.length} item(s) modified` : ''}
@@ -1051,7 +1051,7 @@ export function CatalogItemsTable({
<SortableRow
key={item.id}
id={item.id}
className={cn(modified && 'bg-[var(--color-warning-subtle)] dark:bg-[var(--color-warning-subtle)]')}
className={cn(modified && 'bg-[var(--admin-warning-subtle)] dark:bg-[var(--admin-warning-subtle)]')}
>
{({ dragHandleProps }) => (
<>
@@ -1111,7 +1111,7 @@ export function CatalogItemsTable({
className="h-8 text-xs w-16"
title="Credits"
/>
<span className="text-xs text-[var(--color-warning-text-readable)]">c</span>
<span className="text-xs text-[var(--admin-warning)]">c</span>
<Input
type="number"
value={edit?.costPoints ?? item.costPoints}
@@ -1132,7 +1132,7 @@ export function CatalogItemsTable({
) : (
<div className="text-xs">
{item.costCredits > 0 && (
<span className="text-[var(--color-warning-text-readable)]">{item.costCredits}c </span>
<span className="text-[var(--admin-warning)]">{item.costCredits}c </span>
)}
{item.costPoints > 0 && (
<span className={pts.color}>
@@ -1191,7 +1191,7 @@ export function CatalogItemsTable({
<Button
variant="ghost"
size="icon"
className="h-7 w-7 text-[var(--color-success-text-readable)]"
className="h-7 w-7 text-[var(--admin-success)]"
onClick={() => handleSaveOne(item)}
disabled={isSaving || isPending}
title="Save this item"
@@ -213,7 +213,7 @@ export function MovePageCombobox({
value === page.id ? 'opacity-100' : 'opacity-0',
)}
/>
<Star className="mr-1.5 h-3 w-3 text-[var(--color-warning-text-readable)]" />
<Star className="mr-1.5 h-3 w-3 text-[var(--admin-warning)]" />
<span className="text-muted-foreground font-mono text-xs mr-1.5">
#{page.id}
</span>
@@ -55,12 +55,12 @@ export interface InlineEdit {
}
export const POINTS_TYPES: Record<number, { label: string; color: string }> = {
0: { label: 'Duckets', color: 'text-[var(--color-info-text-readable)]' },
5: { label: 'Diamonds', color: 'text-purple-500' },
101: { label: 'Snowflakes', color: 'text-[var(--color-info-text-readable)]' },
103: { label: 'Hearts', color: 'text-pink-500' },
104: { label: 'Stars', color: 'text-[var(--color-warning-text-readable)]' },
105: { label: 'Shells', color: 'text-[var(--color-warning-text-readable)]' },
0: { label: 'Duckets', color: 'text-[var(--admin-info)]' },
5: { label: 'Diamonds', color: 'text-[var(--admin-accent-text)]' },
101: { label: 'Snowflakes', color: 'text-[var(--admin-info)]' },
103: { label: 'Hearts', color: 'text-[var(--admin-error)]' },
104: { label: 'Stars', color: 'text-[var(--admin-warning)]' },
105: { label: 'Shells', color: 'text-[var(--admin-warning)]' },
}
export const DEFAULT_NEW_ITEM = {