From a1be3756c7156626c6ac6dde7e027c7229ac917f Mon Sep 17 00:00:00 2001
From: Torgny Bjers <torgny@bjers.org>
Date: Fri, 26 Jun 2026 18:36:30 -0400
Subject: [PATCH] fix: add font-src CSP directive and styled error page

The themed redesign added self-hosted @fontsource fonts via @font-face
declarations. Without an explicit font-src directive the browser falls
back to default-src and blocks the woff2 files even though they are
served from 'self'. Adding font-src 'self' to _headers unblocks them.

Also adds +error.svelte so SvelteKit error states (e.g. API auth
failures) render inside the root layout with the correct 24px horizontal
padding and theme-aware colours, rather than falling through to the bare
default error page.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 dashboard/src/routes/+error.svelte | 50 ++++++++++++++++++++++++++++++
 dashboard/static/_headers          |  2 +-
 2 files changed, 51 insertions(+), 1 deletion(-)
 create mode 100644 dashboard/src/routes/+error.svelte

diff --git a/dashboard/src/routes/+error.svelte b/dashboard/src/routes/+error.svelte
new file mode 100644
index 0000000..7d01f75
--- /dev/null
+++ b/dashboard/src/routes/+error.svelte
@@ -0,0 +1,50 @@
+<script lang="ts">
+  import { page } from '$app/stores';
+</script>
+
+<svelte:head>
+  <title>Error {$page.status} — Coverage Tracker</title>
+</svelte:head>
+
+<div class="error-page">
+  <p class="status">{$page.status}</p>
+  <h1>{$page.error?.message ?? 'Something went wrong'}</h1>
+  <a href="/">Back to dashboard</a>
+</div>
+
+<style>
+  .error-page {
+    max-width: 1180px;
+    margin: 0 auto;
+    padding: 60px 24px 72px;
+  }
+
+  .status {
+    font-family: var(--font-mono);
+    font-size: 13px;
+    font-weight: 600;
+    color: var(--muted);
+    text-transform: uppercase;
+    letter-spacing: 0.06em;
+    margin: 0 0 12px;
+  }
+
+  h1 {
+    font-family: var(--font-mono);
+    font-size: 22px;
+    font-weight: 700;
+    color: var(--text);
+    margin: 0 0 24px;
+    letter-spacing: -0.01em;
+  }
+
+  a {
+    font-size: 13px;
+    color: var(--link);
+    text-decoration: none;
+  }
+
+  a:hover {
+    text-decoration: underline;
+  }
+</style>
diff --git a/dashboard/static/_headers b/dashboard/static/_headers
index f7ef77f..673e711 100644
--- a/dashboard/static/_headers
+++ b/dashboard/static/_headers
@@ -2,4 +2,4 @@
   X-Frame-Options: DENY
   X-Content-Type-Options: nosniff
   Referrer-Policy: strict-origin-when-cross-origin
-  Content-Security-Policy: default-src 'self'; script-src 'self' 'unsafe-inline' https://static.cloudflareinsights.com; style-src 'self' 'unsafe-inline'; img-src 'self' https://avatars.githubusercontent.com; connect-src 'self' https://cloudflareinsights.com; frame-ancestors 'none'; base-uri 'self'; form-action 'self'
+  Content-Security-Policy: default-src 'self'; script-src 'self' 'unsafe-inline' https://static.cloudflareinsights.com; style-src 'self' 'unsafe-inline'; font-src 'self'; img-src 'self' https://avatars.githubusercontent.com; connect-src 'self' https://cloudflareinsights.com; frame-ancestors 'none'; base-uri 'self'; form-action 'self'