Web/404.html

81 lines
2.2 KiB
HTML
Raw Normal View History

2018-08-15 19:26:03 +02:00
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
2018-08-15 23:27:17 +02:00
<title>404</title>
2018-08-15 19:26:03 +02:00
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto">
<link rel="icon" href="favicon.ico">
<style>
body {
font-family: Roboto;
background-color: #383838;
}
.content {
color: white;
position: absolute;
text-align: center;
left: 50%;
top: 40%;
transform: translate(-50%, -60%);
}
.disclaimer {
position: absolute;
bottom: 10px;
right: 10px;
color: gray;
}
a {
2018-08-15 23:38:44 +02:00
color: #8db3f4;
2018-08-15 23:27:17 +02:00
text-decoration: none;
2018-08-15 19:26:03 +02:00
}
2018-08-15 23:38:44 +02:00
.email {
color: #6c767c;
}
.go-home {
margin-top: 25px;
}
2018-08-15 19:26:03 +02:00
</style>
</head>
<body>
<div class="content">
2018-08-15 23:27:17 +02:00
<h1>Four Oh Four</h1>
2018-08-15 19:26:03 +02:00
<p>
There's nothing here, I'm sorry.
</p>
<p>
<span id="message"></span>
<script>
const messages = [
'Maybe try a different place?',
'Do you want to know a secret?',
2018-08-15 23:27:17 +02:00
'This is a magical place',
2018-08-15 19:26:03 +02:00
'What were you trying to find?',
'Now my day is ruined',
'There\'s a place like this somewhere',
'I shall overcome this obstacle.',
2018-08-15 23:27:17 +02:00
'Why are you like this?',
'this is so sad alexa play despacito',
'The server is at a loss for what you were trying to find',
'oh no :('
2018-08-15 19:26:03 +02:00
];
let message = Math.floor(Math.random() * messages.length);
document.getElementById('message').innerHTML = '<em>' + messages[message] + '</em>';
</script>
</p>
2018-08-15 23:38:44 +02:00
<p class="go-home">
<a href="https://ellpeck.de">Go home</a>
</p>
2018-08-15 19:26:03 +02:00
</div>
<div class="disclaimer">
2018-08-15 23:38:44 +02:00
<em>If you think there should be something here, please notify me at <a class="email" href="mailto:me@ellpeck.de">me@ellpeck.de</a>.</em>
2018-08-15 19:26:03 +02:00
</div>
</body>
</html>