Files
familienarchiv/frontend/src/routes/enrich/+page.svelte
Marcel cc9c47254b refactor(nav): replace static back-link hrefs with BackButton
All 7 in-scope back navigation links converted to use history.back().
Admin panel mobile chevron converted inline (icon-only, different
visual pattern). Cancel buttons left as static <a> links.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-04-22 10:49:23 +02:00

84 lines
2.3 KiB
Svelte

<script lang="ts">
import { m } from '$lib/paraglide/messages.js';
import BackButton from '$lib/components/BackButton.svelte';
let { data } = $props();
const documents = $derived(data.documents);
const count = $derived(documents.length);
</script>
<div class="mx-auto max-w-4xl px-4 py-10">
<!-- Back Link -->
<BackButton />
<!-- Page Header -->
<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-ink">
{m.enrich_list_heading()}
</h1>
{#if count > 0}
<p class="mt-2 font-sans text-sm text-ink-2">
{count}
{m.enrich_list_count()}
</p>
{/if}
</div>
{#if count > 0}
<a
href="/enrich/{documents[0].id}"
class="bg-primary px-5 py-2 font-sans text-xs font-bold tracking-widest text-primary-fg uppercase transition-colors hover:bg-primary/90"
>
{m.enrich_list_start()}
</a>
{/if}
</div>
<!-- Empty State -->
{#if count === 0}
<div
class="flex flex-col items-center justify-center rounded-sm border border-dashed border-line bg-surface py-20 text-center"
>
<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=""
aria-hidden="true"
class="h-7 w-7 opacity-50"
/>
</div>
<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-ink-2">
{m.enrich_list_empty_body()}
</p>
</div>
{:else}
<!-- Document Rows -->
<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 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-ink group-hover:underline">
{doc.title}
</p>
</div>
<img
src="/degruyter-icons/Simple/Medium-24px/SVG/Action/Arrow/Arrow-Right-MD.svg"
alt=""
aria-hidden="true"
class="ml-4 h-5 w-5 shrink-0 opacity-30 transition-opacity group-hover:opacity-70"
/>
</a>
</li>
{/each}
</ul>
</div>
{/if}
</div>