Skip to content

Commit 8141202

Browse files
committed
Dark mode design
1 parent dbf8141 commit 8141202

3 files changed

Lines changed: 394 additions & 58 deletions

File tree

404.html

Lines changed: 78 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,78 @@
44
<meta charset="UTF-8">
55
<meta name="viewport" content="width=device-width, initial-scale=1.0">
66
<title>Page Not Found - Retune</title>
7+
<style>
8+
* {
9+
box-sizing: border-box;
10+
margin: 0;
11+
padding: 0;
12+
}
13+
14+
body {
15+
display: flex;
16+
justify-content: center;
17+
align-items: center;
18+
min-height: 100vh;
19+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
20+
text-align: center;
21+
background-color: #0A1716;
22+
color: white;
23+
padding: 20px;
24+
}
25+
26+
.container {
27+
max-width: 500px;
28+
}
29+
30+
h1 {
31+
font-size: 72px;
32+
font-weight: 700;
33+
color: #5649ab;
34+
margin-bottom: 16px;
35+
line-height: 1;
36+
}
37+
38+
h2 {
39+
font-size: 28px;
40+
font-weight: 600;
41+
color: white;
42+
margin-bottom: 16px;
43+
}
44+
45+
p {
46+
font-size: 18px;
47+
color: rgba(255, 255, 255, 0.8);
48+
margin-bottom: 32px;
49+
line-height: 1.6;
50+
}
51+
52+
.btn {
53+
display: inline-flex;
54+
align-items: center;
55+
justify-content: center;
56+
padding: 14px 32px;
57+
font-size: 16px;
58+
font-weight: 600;
59+
color: white;
60+
background-color: #5649ab;
61+
border: none;
62+
border-radius: 12px;
63+
cursor: pointer;
64+
text-decoration: none;
65+
transition: all 0.3s ease;
66+
box-shadow: 0 4px 14px rgba(86, 73, 171, 0.3);
67+
}
68+
69+
.btn:hover {
70+
background-color: #6b5fc7;
71+
transform: translateY(-2px);
72+
box-shadow: 0 6px 20px rgba(86, 73, 171, 0.4);
73+
}
74+
75+
.btn:active {
76+
transform: translateY(0);
77+
}
78+
</style>
779
<script>
880
// Don't interfere with .well-known files
981
(function() {
@@ -15,11 +87,12 @@
1587
})();
1688
</script>
1789
</head>
18-
<body style="display:flex; justify-content:center; align-items:center; height:100vh; font-family:sans-serif; text-align:center;">
19-
<div>
20-
<h1>404 - Page Not Found</h1>
21-
<p>The page you're looking for doesn't exist.</p>
22-
<p><a href="/" style="color: #ff6600;">Return to home</a></p>
90+
<body>
91+
<div class="container">
92+
<h1>404</h1>
93+
<h2>Page Not Found</h2>
94+
<p>The page you're looking for doesn't exist or has been moved.</p>
95+
<a href="/" class="btn">Return to Home</a>
2396
</div>
2497
</body>
2598
</html>

0 commit comments

Comments
 (0)