style(frontend): improve semantic markup

kingsdigitallab · Jul 5, 2024 · fcb965b · fcb965b
1 parent 9d8dcdc
commit fcb965b
Showing 1 changed file with 14 additions and 2 deletions.
diff --git a/frontend/src/routes/+error.svelte b/frontend/src/routes/+error.svelte
@@ -2,5 +2,17 @@
 	import { page } from '$app/stores';
 </script>
 
-<h1>{$page.status}: {$page.error?.message}</h1>
-<p>Error loading the page {$page.url.pathname}.</p>
+<article>
+	<h1>{$page.status}</h1>
+	<output>{$page.error?.message}</output>
+	<p>Error loading the page {$page.url.pathname}.</p>
+</article>
+
+<style>
+	output {
+		font-size: 90%;
+		opacity: 60%;
+		text-transform: uppercase;
+		letter-spacing: 0.1em;
+	}
+</style>