In dark mode --c-primary switches from navy (#012851) to mint (#a1dcd8). Buttons using bg-primary+text-white showed white text on mint at 1.4:1 contrast — invisible. bg-brand-navy buttons were also invisible (navy on near-black canvas, 1.3:1). Replaced in 28 components app-wide: - bg-primary ... text-white → text-primary-fg - hover:bg-primary hover:text-white → hover:text-primary-fg - bg-brand-navy ... text-white + hover:bg-brand-navy/90 → bg-primary ... text-primary-fg + hover:bg-primary/90 Light mode is unchanged: primary-fg = white in light mode. Dark mode: primary-fg = navy (#012851) on mint bg = readable. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
41 lines
1.0 KiB
Svelte
41 lines
1.0 KiB
Svelte
<script lang="ts">
|
|
import { m } from '$lib/paraglide/messages.js';
|
|
</script>
|
|
|
|
<div class="mx-auto max-w-4xl px-4 py-10">
|
|
<div
|
|
class="border-brand-sand flex flex-col items-center justify-center rounded-sm border bg-white py-20 text-center shadow-sm"
|
|
>
|
|
<img
|
|
src="/degruyter-icons/Simple/Large-32px/SVG/Action/Check/Check-Double-LG.svg"
|
|
alt=""
|
|
aria-hidden="true"
|
|
class="mb-6 h-16 w-16"
|
|
/>
|
|
|
|
<h1 class="font-serif text-2xl font-medium text-brand-navy">
|
|
{m.enrich_done_heading()}
|
|
</h1>
|
|
|
|
<p class="mt-2 max-w-xs font-sans text-sm text-ink-2">
|
|
{m.enrich_done_body()}
|
|
</p>
|
|
|
|
<div class="mt-8 flex flex-col items-center gap-4">
|
|
<a
|
|
href="/"
|
|
class="bg-primary px-6 py-2 font-sans text-xs font-bold tracking-widest text-primary-fg uppercase transition-colors hover:bg-primary/90"
|
|
>
|
|
{m.btn_back_to_overview()}
|
|
</a>
|
|
|
|
<a
|
|
href="/enrich"
|
|
class="font-sans text-xs text-ink-2 underline-offset-4 transition-colors hover:text-ink hover:underline"
|
|
>
|
|
{m.enrich_back_to_list()}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|