fix: enforce semantic contrast across admin
Local Build and Deploy / deploy (push) Successful in 44s

This commit is contained in:
Simo committed 2026-07-12 15:14:15 +02:00
1 parent 45c8178cfa
commit f0b4bc1630
86 files changed
+438 -338

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-orange-500 text-white text-[10px] px-1.5 py-0.5 leading-none font-medium">
<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">
{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-yellow-300 bg-yellow-50 dark:border-yellow-700 dark:bg-yellow-950/30 px-3 py-2 text-sm text-yellow-800 dark:text-yellow-200">
<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)]">
<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-yellow-50 dark:bg-yellow-950/20')}
className={cn(modified && 'bg-[var(--color-warning-subtle)] dark:bg-[var(--color-warning-subtle)]')}
>
{({ dragHandleProps }) => (
<>
@@ -1111,7 +1111,7 @@ export function CatalogItemsTable({
className="h-8 text-xs w-16"
title="Credits"
/>
<span className="text-xs text-yellow-600">c</span>
<span className="text-xs text-[var(--color-warning-text-readable)]">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-yellow-600">{item.costCredits}c </span>
<span className="text-[var(--color-warning-text-readable)]">{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-green-600"
className="h-7 w-7 text-[var(--color-success-text-readable)]"
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-amber-500" />
<Star className="mr-1.5 h-3 w-3 text-[var(--color-warning-text-readable)]" />
<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-blue-500' },
0: { label: 'Duckets', color: 'text-[var(--color-info-text-readable)]' },
5: { label: 'Diamonds', color: 'text-purple-500' },
101: { label: 'Snowflakes', color: 'text-cyan-400' },
101: { label: 'Snowflakes', color: 'text-[var(--color-info-text-readable)]' },
103: { label: 'Hearts', color: 'text-pink-500' },
104: { label: 'Stars', color: 'text-amber-400' },
105: { label: 'Shells', color: 'text-orange-400' },
104: { label: 'Stars', color: 'text-[var(--color-warning-text-readable)]' },
105: { label: 'Shells', color: 'text-[var(--color-warning-text-readable)]' },
}
export const DEFAULT_NEW_ITEM = {
@@ -81,5 +81,5 @@ export const DEFAULT_NEW_ITEM = {
}
export function getPointsLabel(type: number) {
return POINTS_TYPES[type] || { label: `Type ${type}`, color: 'text-gray-500' }
return POINTS_TYPES[type] || { label: `Type ${type}`, color: 'theme-text-muted' }
}
@@ -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-orange-600 dark:text-orange-400">
<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)]">
<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-yellow-50 dark:bg-yellow-950/20'
? 'bg-[var(--color-warning-subtle)] dark:bg-[var(--color-warning-subtle)]'
: isMissing
? 'bg-orange-50/50 dark:bg-orange-950/10'
? 'bg-[var(--color-warning-subtle)] dark:bg-[var(--color-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-yellow-400 dark:border-yellow-600' : ''}`}
className={`h-8 text-sm ${nameChanged ? 'border-[var(--color-warning-border)] dark:border-[var(--color-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-yellow-400 dark:border-yellow-600' : ''}`}
className={`h-8 text-sm ${descChanged ? 'border-[var(--color-warning-border)] dark:border-[var(--color-warning-border)]' : ''}`}
/>
</TableCell>
<TableCell>
@@ -464,7 +464,7 @@ export function CatalogTranslateTab({
{isChanged ? (
<Badge
variant="secondary"
className="text-xs bg-yellow-100 text-yellow-800 dark:bg-yellow-900 dark:text-yellow-200"
className="text-xs bg-[var(--color-warning-subtle)] text-[var(--color-warning-text-readable)]"
>
Modified
</Badge>
@@ -474,7 +474,7 @@ export function CatalogTranslateTab({
{isMissing ? (
<Tooltip>
<TooltipTrigger asChild>
<AlertTriangle className="h-3.5 w-3.5 text-orange-500 flex-shrink-0" />
<AlertTriangle className="h-3.5 w-3.5 text-[var(--color-warning-text-readable)] 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-green-500 flex-shrink-0" />
<CheckCircle2 className="h-3.5 w-3.5 text-[var(--color-success-text-readable)] 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-amber-500" />
<HardHat className="h-5 w-5 text-[var(--color-warning-text-readable)]" />
<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-red-500 hover:text-red-600"
className="h-6 w-6 p-0 text-[var(--color-error-text-readable)] hover:text-[var(--color-error-text-readable)]"
onClick={() => {
if (!confirm(`Delete item "${item.catalogName}"?`)) return
run(() => deleteBcItem({ id: item.id }), {