Skip to content

Commit eac1f30

Browse files
sdavidssdavids
committed
refactor: improve error pages
Signed-off-by: Sebastian Davids <[email protected]>
1 parent d87618a commit eac1f30

File tree

3 files changed

+17
-284
lines changed

3 files changed

+17
-284
lines changed

‎hp/src/e/403.html

+5-93
Original file line numberDiff line numberDiff line change
@@ -3,25 +3,24 @@
33
SPDX-FileCopyrightText: © 2023 Sebastian Davids <[email protected]>
44
SPDX-License-Identifier: Apache-2.0
55
-->
6-
<html lang="en" dir="ltr">
6+
<html lang="en">
77
<head>
88
<meta charset="utf-8" />
9-
<meta name="description" content="you may not access the requested page" />
109
<title>Forbidden</title>
10+
<meta name="viewport" content="width=device-width,initial-scale=1" />
11+
<meta name="color-scheme" content="light dark" />
1112
<style>
1213
html {
1314
-webkit-text-size-adjust: 100%;
1415
-webkit-tap-highlight-color: transparent;
1516
font-family: ui-sans-serif, system-ui, sans-serif;
16-
line-height: 1.5;
1717
}
1818

1919
body {
2020
text-align: center;
2121
background-color: #e5e7eb;
2222
flex-direction: column;
2323
min-height: 100vh;
24-
margin: 0;
2524
display: flex;
2625
}
2726

@@ -31,114 +30,27 @@
3130
display: grid;
3231
}
3332

34-
footer {
35-
padding: 3rem;
36-
}
37-
3833
a {
3934
color: inherit;
4035
-webkit-text-decoration: inherit;
4136
text-decoration: inherit;
4237
}
4338

44-
h1 {
45-
letter-spacing: -0.025em;
46-
margin: 1rem 0 0;
47-
font-size: 1.875rem;
48-
font-weight: 700;
49-
line-height: 2.25rem;
50-
}
51-
52-
p {
53-
margin: 0;
54-
padding: 0 1rem;
55-
}
56-
57-
.mt-10 {
58-
margin-top: 2.5rem;
59-
}
60-
61-
.mt-6 {
62-
margin-top: 1.5rem;
63-
}
64-
65-
.text-sm {
66-
font-size: 0.875rem;
67-
line-height: 1.25rem;
68-
}
69-
70-
.font-semibold {
71-
font-weight: 600;
72-
}
73-
74-
.text-gray-700 {
75-
color: #374151;
76-
}
77-
78-
@media (min-width: 640px) {
79-
h1 {
80-
font-size: 3rem;
81-
line-height: 1;
82-
}
83-
84-
.sm\:text-base {
85-
font-size: 1rem;
86-
line-height: 1.5rem;
87-
}
88-
}
89-
9039
@media (prefers-color-scheme: dark) {
9140
body {
9241
background-color: #000;
9342
}
94-
95-
.dark\:text-gray-300 {
96-
color: #d1d5db;
97-
}
9843
}
9944
</style>
100-
<meta name="viewport" content="width=device-width,initial-scale=1" />
101-
<meta name="color-scheme" content="light dark" />
102-
<meta
103-
name="theme-color"
104-
media="(prefers-color-scheme: light)"
105-
content="#fff"
106-
/>
107-
<meta
108-
name="theme-color"
109-
media="(prefers-color-scheme: dark)"
110-
content="#000"
111-
/>
112-
<meta name="referrer" content="strict-origin-when-cross-origin" />
113-
<meta name="robots" content="noindex" />
114-
<link rel="icon" href="../favicon.ico" sizes="any" />
115-
<link rel="icon" href="../favicon.svg" type="image/svg+xml" />
116-
<link
117-
rel="apple-touch-icon"
118-
href="../apple-touch-icon.png"
119-
sizes="180x180"
120-
/>
121-
<meta name="rating" content="general" />
12245
</head>
12346
<body>
12447
<main>
12548
<div>
126-
<p class="font-semibold">403</p>
12749
<h1>Forbidden</h1>
128-
<p class="mt-6 text-gray-700 dark:text-gray-300">
129-
Sorry, you may not access the requested page.
50+
<p>
51+
<a href="/"><span aria-hidden="true">← </span>Back to home</a>
13052
</p>
131-
<div class="mt-10">
132-
<a href="https://sdavids.de" class="text-sm font-semibold"
133-
><span aria-hidden="true">←</span> Back to home</a
134-
>
135-
</div>
13653
</div>
13754
</main>
138-
<footer>
139-
<p class="text-sm sm:text-base">
140-
©&nbsp;2022-2025 Sebastian&nbsp;Davids
141-
</p>
142-
</footer>
14355
</body>
14456
</html>

‎hp/src/e/404.html

+7-98
Original file line numberDiff line numberDiff line change
@@ -3,28 +3,24 @@
33
SPDX-FileCopyrightText: © 2023 Sebastian Davids <[email protected]>
44
SPDX-License-Identifier: Apache-2.0
55
-->
6-
<html lang="en" dir="ltr">
6+
<html lang="en">
77
<head>
88
<meta charset="utf-8" />
9-
<meta
10-
name="description"
11-
content="we could not find the page you’re looking for"
12-
/>
13-
<title>Page not found</title>
9+
<title>Page Not Found</title>
10+
<meta name="viewport" content="width=device-width,initial-scale=1" />
11+
<meta name="color-scheme" content="light dark" />
1412
<style>
1513
html {
1614
-webkit-text-size-adjust: 100%;
1715
-webkit-tap-highlight-color: transparent;
1816
font-family: ui-sans-serif, system-ui, sans-serif;
19-
line-height: 1.5;
2017
}
2118

2219
body {
2320
text-align: center;
2421
background-color: #e5e7eb;
2522
flex-direction: column;
2623
min-height: 100vh;
27-
margin: 0;
2824
display: flex;
2925
}
3026

@@ -34,114 +30,27 @@
3430
display: grid;
3531
}
3632

37-
footer {
38-
padding: 3rem;
39-
}
40-
4133
a {
4234
color: inherit;
4335
-webkit-text-decoration: inherit;
4436
text-decoration: inherit;
4537
}
4638

47-
h1 {
48-
letter-spacing: -0.025em;
49-
margin: 1rem 0 0;
50-
font-size: 1.875rem;
51-
font-weight: 700;
52-
line-height: 2.25rem;
53-
}
54-
55-
p {
56-
margin: 0;
57-
padding: 0 1rem;
58-
}
59-
60-
.mt-10 {
61-
margin-top: 2.5rem;
62-
}
63-
64-
.mt-6 {
65-
margin-top: 1.5rem;
66-
}
67-
68-
.text-sm {
69-
font-size: 0.875rem;
70-
line-height: 1.25rem;
71-
}
72-
73-
.font-semibold {
74-
font-weight: 600;
75-
}
76-
77-
.text-gray-700 {
78-
color: #374151;
79-
}
80-
81-
@media (min-width: 640px) {
82-
h1 {
83-
font-size: 3rem;
84-
line-height: 1;
85-
}
86-
87-
.sm\:text-base {
88-
font-size: 1rem;
89-
line-height: 1.5rem;
90-
}
91-
}
92-
9339
@media (prefers-color-scheme: dark) {
9440
body {
9541
background-color: #000;
9642
}
97-
98-
.dark\:text-gray-300 {
99-
color: #d1d5db;
100-
}
10143
}
10244
</style>
103-
<meta name="viewport" content="width=device-width,initial-scale=1" />
104-
<meta name="color-scheme" content="light dark" />
105-
<meta
106-
name="theme-color"
107-
media="(prefers-color-scheme: light)"
108-
content="#fff"
109-
/>
110-
<meta
111-
name="theme-color"
112-
media="(prefers-color-scheme: dark)"
113-
content="#000"
114-
/>
115-
<meta name="referrer" content="strict-origin-when-cross-origin" />
116-
<meta name="robots" content="noindex" />
117-
<link rel="icon" href="../favicon.ico" sizes="any" />
118-
<link rel="icon" href="../favicon.svg" type="image/svg+xml" />
119-
<link
120-
rel="apple-touch-icon"
121-
href="../apple-touch-icon.png"
122-
sizes="180x180"
123-
/>
124-
<meta name="rating" content="general" />
12545
</head>
12646
<body>
12747
<main>
12848
<div>
129-
<p class="font-semibold">404</p>
130-
<h1>Page not found</h1>
131-
<p class="mt-6 text-gray-700 dark:text-gray-300">
132-
Sorry, we could not find the page you’re looking for.
49+
<h1>Page Not Found</h1>
50+
<p>
51+
<a href="/"><span aria-hidden="true">← </span>Back to home</a>
13352
</p>
134-
<div class="mt-10">
135-
<a href="https://sdavids.de" class="text-sm font-semibold"
136-
><span aria-hidden="true">←</span> Back to home</a
137-
>
138-
</div>
13953
</div>
14054
</main>
141-
<footer>
142-
<p class="text-sm sm:text-base">
143-
©&nbsp;2022-2025 Sebastian&nbsp;Davids
144-
</p>
145-
</footer>
14655
</body>
14756
</html>

0 commit comments

Comments
 (0)