marcel/familienarchiv
1
0
Fork 0
Code Issues 125 Pull Requests Actions Packages Projects Releases Wiki Activity

fix: replace hardcoded brand-navy/white tokens with semantic tokens on enrich list page
Some checks failed
CI / Backend Unit Tests (push) Has been cancelled
Details
CI / E2E Tests (push) Has been cancelled
Details
CI / Unit & Component Tests (push) Has been cancelled
Details

Browse Source 
Fixes dark mode rendering: list stayed white and text stayed dark because
bg-white, text-brand-navy, border-brand-sand were not theme-aware.
Replace with bg-surface, text-ink/ink-2/ink-3, border-line, bg-muted.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-03-28 23:48:03 +01:00
parent 3dd0ff94c6
commit 06fbb2fe81
1 changed files with 11 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
frontend/src/routes/enrich/+page.svelte
View File

@@ -31,13 +31,13 @@ function formatUploadDate(createdAt: string): string {
</a>
<!-- Page Header -->
<div class="border-brand-sand mb-8 flex items-center justify-between border-b pb-6">
<div class="mb-8 flex items-center justify-between border-b border-line pb-6">
<div>
<h1 class="font-serif text-3xl font-medium text-brand-navy">
<h1 class="font-serif text-3xl font-medium text-ink">
{m.enrich_list_heading()}
</h1>
{#if count > 0}
<p class="mt-2 font-sans text-sm text-brand-navy/60">
<p class="mt-2 font-sans text-sm text-ink-2">
{count}
{m.enrich_list_count()}
</p>
@@ -57,9 +57,9 @@ function formatUploadDate(createdAt: string): string {
<!-- Empty State -->
{#if count === 0}
<div
class="border-brand-sand flex flex-col items-center justify-center rounded-sm border border-dashed bg-white py-20 text-center"
class="flex flex-col items-center justify-center rounded-sm border border-dashed border-line bg-surface py-20 text-center"
>
<div class="bg-brand-sand/60 mb-4 flex h-14 w-14 items-center justify-center rounded-full">
<div class="mb-4 flex h-14 w-14 items-center justify-center rounded-full bg-muted">
<img
src="/degruyter-icons/Simple/Medium-24px/SVG/Action/Check/Check-Circle-MD.svg"
alt=""
@@ -67,27 +67,27 @@ function formatUploadDate(createdAt: string): string {
class="h-7 w-7 opacity-50"
/>
</div>
<p class="font-serif text-lg font-medium text-brand-navy">
<p class="font-serif text-lg font-medium text-ink">
{m.enrich_list_empty_heading()}
</p>
<p class="mt-2 max-w-xs font-sans text-sm text-brand-navy/60">
<p class="mt-2 max-w-xs font-sans text-sm text-ink-2">
{m.enrich_list_empty_body()}
</p>
</div>
{:else}
<!-- Document Rows -->
<div class="border border-line bg-white shadow-sm">
<div class="border border-line bg-surface shadow-sm">
<ul class="divide-y divide-line-2">
{#each documents as doc (doc.id)}
<li class="group hover:bg-brand-sand/30 transition-colors duration-200">
<li class="group transition-colors duration-200 hover:bg-muted">
<a href="/enrich/{doc.id}" class="flex items-center justify-between p-6">
<div class="min-w-0 flex-1">
<p
class="font-serif text-lg font-medium text-brand-navy decoration-brand-mint decoration-2 underline-offset-4 group-hover:underline"
class="font-serif text-lg font-medium text-ink decoration-accent decoration-2 underline-offset-4 group-hover:underline"
>
{doc.title || doc.originalFilename}
</p>
<p class="mt-1 font-sans text-xs text-brand-navy/50">
<p class="mt-1 font-sans text-xs text-ink-3">
{formatUploadDate(doc.createdAt)}
</p>
</div>