finxol.io
Personal site
staging.colinozanne.co.uk
portfolio
astro
feat: add custom 404 page
+36
+1
src/assets/styles/main.css
+1
src/assets/styles/main.css
···
5
5
@import "@evilmartians/harmony/css/emerald.css";
6
6
@import "@evilmartians/harmony/css/teal.css";
7
7
@import "@evilmartians/harmony/css/sky.css";
8
+
@import "@evilmartians/harmony/css/indigo.css";
8
9
@import "@evilmartians/harmony/css/fuchsia.css";
9
10
@import "@evilmartians/harmony/css/rose.css";
10
11
@import "@evilmartians/harmony/css/gray.css";
+35
src/pages/404.astro
+35
src/pages/404.astro
···
1
+
---
2
+
import Layout from "@/layouts/Layout.astro";
3
+
---
4
+
5
+
<Layout>
6
+
<article>
7
+
<h1>404 Not Found</h1>
8
+
<a href="/">Go home</a>
9
+
</article>
10
+
</Layout>
11
+
12
+
<style>
13
+
article {
14
+
display: flex;
15
+
flex-direction: column;
16
+
align-items: center;
17
+
justify-content: center;
18
+
height: 100%;
19
+
}
20
+
21
+
h1 {
22
+
font-size: 2rem;
23
+
margin-bottom: 1rem;
24
+
}
25
+
26
+
a {
27
+
color: var(--indigo-500);
28
+
text-decoration: none;
29
+
transition: color 0.3s ease;
30
+
}
31
+
32
+
a:hover {
33
+
color: var(--indigo-700);
34
+
}
35
+
</style>