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

refactor(dashboard): replace new CSS tokens with existing equivalents
Some checks failed
CI / Unit & Component Tests (pull_request) Failing after 4m0s
Details
CI / OCR Service Tests (pull_request) Successful in 32s
Details
CI / Backend Unit Tests (pull_request) Failing after 3m21s
Details
CI / Unit & Component Tests (push) Has been cancelled
Details
CI / OCR Service Tests (push) Has been cancelled
Details
CI / Backend Unit Tests (push) Has been cancelled
Details

Browse Source 
mint-soft → accent-bg, line-soft → line-2, link-quiet → ink-2,
ink-4 removed (was never applied to any element).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit was merged in pull request #484.
This commit is contained in:
Marcel
2026-05-08 23:12:36 +02:00
parent d464bca9f3
commit 7c2c4741ab
7 changed files with 11 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
frontend/src/lib/shared/dashboard/ReaderHeaderBar.svelte
View File

@@ -37,11 +37,11 @@ const timeLabel = $derived.by(() => {
<!-- Stats -->
<div
class="flex w-full items-center border-t border-line-soft pt-1.5 sm:w-auto sm:border-t-0 sm:pt-0"
class="flex w-full items-center border-t border-line-2 pt-1.5 sm:w-auto sm:border-t-0 sm:pt-0"
>
<a
href="/documents"
class="flex min-h-[44px] flex-col items-center justify-center border-r border-line-soft px-5 focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:outline-none"
class="flex min-h-[44px] flex-col items-center justify-center border-r border-line-2 px-5 focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:outline-none"
>
<span class="block text-2xl leading-none font-black text-ink">{documents ?? '—'}</span>
<span
@@ -56,7 +56,7 @@ const timeLabel = $derived.by(() => {
<a
href="/persons"
class="flex min-h-[44px] flex-col items-center justify-center border-r border-line-soft px-5 focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:outline-none"
class="flex min-h-[44px] flex-col items-center justify-center border-r border-line-2 px-5 focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:outline-none"
>
<span class="block text-2xl leading-none font-black text-ink">{persons ?? '—'}</span>
<span

2
frontend/src/lib/shared/dashboard/ReaderPersonChips.svelte
View File

@@ -58,7 +58,7 @@ const { persons }: Props = $props();
</div>
<a
href="/persons"
class="mt-1 flex min-h-[44px] items-center justify-end text-right text-xs font-semibold text-link-quiet no-underline focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:outline-none"
class="mt-1 flex min-h-[44px] items-center justify-end text-right text-xs font-semibold text-ink-2 no-underline focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:outline-none"
>{m.dashboard_reader_all_persons()}</a
>
</section>

4
frontend/src/lib/shared/dashboard/ReaderPersonChips.svelte.spec.ts
View File

@@ -92,11 +92,11 @@ describe('ReaderPersonChips', () => {
await expect.element(allLink).toHaveAttribute('href', '/persons');
});
it('"Alle Personen" link has text-link-quiet class', async () => {
it('"Alle Personen" link has text-ink-2 class', async () => {
render(ReaderPersonChips, { persons: [person1] });
const allLink = page.getByRole('link', { name: /Alle Personen/i });
const cls = ((await allLink.element()) as HTMLElement).className;
expect(cls).toMatch(/text-link-quiet/);
expect(cls).toMatch(/text-ink-2/);
});
it('exposes a focus-visible ring on the "Alle Personen" link', async () => {

4
frontend/src/lib/shared/dashboard/ReaderRecentDocs.svelte
View File

@@ -24,7 +24,7 @@ function isNew(doc: Document): boolean {
</h3>
<a
href="/documents"
class="flex min-h-[44px] items-center text-[11px] font-semibold text-link-quiet no-underline focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:outline-none"
class="flex min-h-[44px] items-center text-[11px] font-semibold text-ink-2 no-underline focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:outline-none"
>
{m.dashboard_all_documents()}
</a>
@@ -61,7 +61,7 @@ function isNew(doc: Document): boolean {
<span class="truncate font-serif text-sm text-ink">{doc.title}</span>
{#if isNew(doc)}
<span
class="shrink-0 rounded-full bg-mint-soft px-1.5 py-px text-[11px] font-bold text-ink dark:bg-mint-soft"
class="shrink-0 rounded-full bg-accent-bg px-1.5 py-px text-[11px] font-bold text-ink"
>
{m.dashboard_badge_new()}
</span>

4
frontend/src/lib/shared/dashboard/ReaderRecentDocs.svelte.spec.ts
View File

@@ -88,12 +88,12 @@ describe('ReaderRecentDocs', () => {
expect(thumb!.className).toMatch(/rounded-/);
});
it('shows "Neu" mint-pill badge when createdAt equals updatedAt', async () => {
it('shows "Neu" accent-pill badge when createdAt equals updatedAt', async () => {
render(ReaderRecentDocs, { documents: [baseDoc] });
const badge = page.getByText(/^Neu$/i);
await expect.element(badge).toBeInTheDocument();
const cls = ((await badge.element()) as HTMLElement).className;
expect(cls).toMatch(/bg-mint-soft/);
expect(cls).toMatch(/bg-accent-bg/);
expect(cls).toMatch(/rounded-full/);
expect(cls).toMatch(/\btext-ink\b/);
});

2
frontend/src/lib/shared/dashboard/ReaderRecentStories.svelte
View File

@@ -32,7 +32,7 @@ function excerpt(body: string | undefined): string {
</h3>
<a
href="/geschichten"
class="flex min-h-[44px] items-center text-[11px] font-semibold text-link-quiet no-underline focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:outline-none"
class="flex min-h-[44px] items-center text-[11px] font-semibold text-ink-2 no-underline focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:outline-none"
>
{m.dashboard_reader_all_stories()}
</a>