fix: use semantic colors across admin pages
Local Build and Deploy / deploy (push) Successful in 49s

This commit is contained in:
Simo committed 2026-07-12 18:50:45 +02:00
1 parent 0fe482009c
commit 84e4123f09
83 files changed
+466 -455

No files matched your search

@@ -82,7 +82,7 @@ export function CatalogDetailTabs({
const furniSet = new Set(furniDataIdList)
const missing = baseItems.filter((b) => !furniSet.has(b.id)).length
return missing > 0 ? (
<span className="ml-1 rounded-full bg-[var(--color-warning-subtle)] text-[var(--color-warning-text-readable)] text-[10px] px-1.5 py-0.5 leading-none font-medium">
<span className="ml-1 rounded-full bg-[var(--admin-warning-subtle)] text-[var(--admin-warning)] text-[10px] px-1.5 py-0.5 leading-none font-medium">
{missing}
</span>
) : null
@@ -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 = {
@@ -271,7 +271,7 @@ export function CatalogTranslateTab({
</span>
</div>
{missingItems.length > 0 && (
<div className="flex items-center gap-1.5 mt-2 text-xs text-[var(--color-warning-text-readable)] dark:text-[var(--color-warning-text-readable)]">
<div className="flex items-center gap-1.5 mt-2 text-xs text-[var(--admin-warning)] dark:text-[var(--admin-warning)]">
<AlertTriangle className="h-3.5 w-3.5" />
<span>
{missingItems.length} item(s) missing from FurnitureData.json — will be
@@ -399,9 +399,9 @@ export function CatalogTranslateTab({
key={item.id}
className={
isChanged
? 'bg-[var(--color-warning-subtle)] dark:bg-[var(--color-warning-subtle)]'
? 'bg-[var(--admin-warning-subtle)] dark:bg-[var(--admin-warning-subtle)]'
: isMissing
? 'bg-[var(--color-warning-subtle)] dark:bg-[var(--color-warning-subtle)]'
? 'bg-[var(--admin-warning-subtle)] dark:bg-[var(--admin-warning-subtle)]'
: undefined
}
>
@@ -442,7 +442,7 @@ export function CatalogTranslateTab({
value={editedNames[item.id] || ''}
onChange={(e) => handleNameChange(item.id, e.target.value)}
disabled={!canEdit}
className={`h-8 text-sm ${nameChanged ? 'border-[var(--color-warning-border)] dark:border-[var(--color-warning-border)]' : ''}`}
className={`h-8 text-sm ${nameChanged ? 'border-[var(--admin-warning-border)] dark:border-[var(--admin-warning-border)]' : ''}`}
/>
{currentCatalogName && currentCatalogName !== item.publicName && (
<p className="text-[11px] text-muted-foreground mt-0.5 truncate">
@@ -456,7 +456,7 @@ export function CatalogTranslateTab({
onChange={(e) => handleDescChange(item.id, e.target.value)}
disabled={!canEdit}
placeholder="No description"
className={`h-8 text-sm ${descChanged ? 'border-[var(--color-warning-border)] dark:border-[var(--color-warning-border)]' : ''}`}
className={`h-8 text-sm ${descChanged ? 'border-[var(--admin-warning-border)] dark:border-[var(--admin-warning-border)]' : ''}`}
/>
</TableCell>
<TableCell>
@@ -464,7 +464,7 @@ export function CatalogTranslateTab({
{isChanged ? (
<Badge
variant="secondary"
className="text-xs bg-[var(--color-warning-subtle)] text-[var(--color-warning-text-readable)]"
className="text-xs bg-[var(--admin-warning-subtle)] text-[var(--admin-warning)]"
>
Modified
</Badge>
@@ -474,7 +474,7 @@ export function CatalogTranslateTab({
{isMissing ? (
<Tooltip>
<TooltipTrigger asChild>
<AlertTriangle className="h-3.5 w-3.5 text-[var(--color-warning-text-readable)] flex-shrink-0" />
<AlertTriangle className="h-3.5 w-3.5 text-[var(--admin-warning)] flex-shrink-0" />
</TooltipTrigger>
<TooltipContent>
<p>Missing from FurnitureData.json</p>
@@ -486,7 +486,7 @@ export function CatalogTranslateTab({
) : (
<Tooltip>
<TooltipTrigger asChild>
<CheckCircle2 className="h-3.5 w-3.5 text-[var(--color-success-text-readable)] flex-shrink-0" />
<CheckCircle2 className="h-3.5 w-3.5 text-[var(--admin-success)] flex-shrink-0" />
</TooltipTrigger>
<TooltipContent>In FurnitureData.json</TooltipContent>
</Tooltip>
@@ -124,7 +124,7 @@ export function BcPageDetail({ page, items, canEdit }: BcPageDetailProps) {
</Link>
<span className="text-muted-foreground">/</span>
<div className="flex items-center gap-2">
<HardHat className="h-5 w-5 text-[var(--color-warning-text-readable)]" />
<HardHat className="h-5 w-5 text-[var(--admin-warning)]" />
<h1 className="text-2xl font-bold tracking-tight">{page.caption}</h1>
<Badge variant="outline" className="font-mono text-xs">
#{page.id}
@@ -306,7 +306,7 @@ export function BcPageDetail({ page, items, canEdit }: BcPageDetailProps) {
type="button"
variant="ghost"
size="sm"
className="h-6 w-6 p-0 text-[var(--color-error-text-readable)] hover:text-[var(--color-error-text-readable)]"
className="h-6 w-6 p-0 text-[var(--admin-error)] hover:text-[var(--admin-error)]"
onClick={() => {
if (!confirm(`Delete item "${item.catalogName}"?`)) return
run(() => deleteBcItem({ id: item.id }), {