make error page a bit more responsive
All checks were successful
continuous-integration/drone/push Build is passing

This commit is contained in:
Robert Kaussow 2020-07-16 21:59:05 +02:00
parent 051dad25bb
commit 0ccf250cae
No known key found for this signature in database
GPG Key ID: 65362AE74AF98B61

View File

@ -1,83 +1,79 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta <meta
name="viewport" name="viewport"
content="width=device-width, initial-scale=1, shrink-to-fit=no" content="width=device-width, initial-scale=1, shrink-to-fit=no"
/> />
<meta name="robots" content="noindex, nofollow" /> <meta name="robots" content="noindex, nofollow" />
<title>Oops! You're lost.</title> <title>Oops! You're lost.</title>
<style> <style>
html, html,
body { body {
height: 100%; height: 100%;
min-height: 100%; min-height: 100%;
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
body { body {
cursor: default; cursor: default;
font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI",
Roboto, "Helvetica Neue", Arial, sans-serif; Roboto, "Helvetica Neue", Arial, sans-serif;
font-size: 0.875rem; font-size: 1rem;
font-weight: normal; font-weight: normal;
line-height: 1.5; line-height: 1.5;
color: #383e4b; color: #383e4b;
background-color: #f5f5f5; background-color: #f5f5f5;
} }
h1 { h1 {
font-size: 4.5rem; font-size: 4.5rem;
font-weight: 300; font-weight: 300;
line-height: 1.1; margin: 0 1.5rem 0 0;
float: left; }
margin: 0 1.5rem; h4 {
} font-size: 1.5rem;
h4 { margin: 0;
font-size: 1.5rem; }
padding: 0.7rem 0 0 0;
margin: 0;
}
p { p {
font-weight: 500; font-weight: 500;
line-height: 1.1; line-height: 1;
color: #9da0a8; color: #9da0a8;
padding: 0; padding: 0;
margin: 0; margin: 0;
} }
.wrapper { .container {
position: relative; display: flex;
top: 50%; margin: 0;
-webkit-transform: translateY(-60%); align-items: center;
-ms-transform: translateY(-60%); justify-content: center;
transform: translateY(-60%); box-sizing: border-box;
} height: 100%;
min-width: 380px;
}
.container { .no-wrap {
width: 550px; flex-shrink: 0;
margin: 0 auto; }
}
</style> </style>
</head> </head>
<body> <body>
<div class="wrapper"> <div class="container">
<div class="container"> <div>
<h1> <h1><!--# echo var="status" default="" --></h1>
<!--# echo var="status" default="" --> </div>
</h1> <div class="no-wrap">
<h4>Oops! You're lost.</h4> <h4>Oops! You're lost.</h4>
<p> <p><!--# echo var="status_text" default="Something goes wrong" --></p>
<!--# echo var="status_text" default="Something goes wrong" --> </div>
</p>
</div>
</div> </div>
</body> </body>
</html> </html>