404 page ui

src/routes/+error.svelte

@@ -1,5 +1,6 @@
 <script>
   import AppBar from "$lib/ui/appbar/AppBar.svelte" 
+  import Button from "$lib/ui/Button.svelte"
   import { getI18n } from "$lib/i18n";
 
   const t = getI18n().errorPage;
@@ -13,8 +14,10 @@
   
 <AppBar title={t.title} >
 </AppBar>
-  <div class="p-content">
-    <p>{@html t.message}</p>
-    <a href="/">{t.return}</a>
+  <div class="p-content error-page__content">
+    <p class="error-page__text" >{@html t.message}</p>
+    <div class="error-page__button-container">
+      <Button class="error-page__button">{t.return}</Button>
+    </div>
   </div>
 </main>

src/style/app.sass

@@ -44,4 +44,20 @@ body
     margin: 0 auto;
 
 .error-page__link
-    text-decoration: underline;
+    text-decoration: underline;
+
+.error-page__button
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+
+
+.error-page__text
+    margin-top: 12px;
+
+.error-page__button-container
+    position: absolute;
+    bottom: 16px;
+    width: calc(100% - 32px)
+    max-width: 450px;