Adjust layout and apply text suggestions
This commit is contained in:
Andreas Nedbal
Andreas Nedbal
parent
247d84415a
commit
eed2640326
|
|
@ -2,7 +2,7 @@
|
|||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Page not found!</title>
|
||||
<title>Page not found</title>
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||||
<style>
|
||||
:root {
|
||||
|
|
@ -82,7 +82,11 @@
|
|||
max-width: 100%;
|
||||
}
|
||||
|
||||
@media (min-width: 576px) {
|
||||
.error-text-container {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
body {
|
||||
padding: 3rem 1rem 1rem 1rem;
|
||||
}
|
||||
|
|
@ -92,43 +96,51 @@
|
|||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
@media (min-width: 992px) {
|
||||
body {
|
||||
padding: 5rem 1rem 3rem 1rem;
|
||||
}
|
||||
|
||||
.error-artwork-container picture {
|
||||
width: 768px;
|
||||
.error {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.error-text-container {
|
||||
align-self: center;
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="error-artwork-container">
|
||||
<picture>
|
||||
<source
|
||||
srcset="/images/errors/small/404.png 576w,
|
||||
/images/errors/medium/404.png 768w,
|
||||
/images/errors/original/404.png 1200w">
|
||||
<img src="/images/errors/small/404.png"/>
|
||||
</picture>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<h1>
|
||||
<span class="text-primary font-weight-bold">404</span>
|
||||
<small class="text-muted">Page not found</small>
|
||||
</h1>
|
||||
<p>
|
||||
Whatever you might have been searching for, it's not here!
|
||||
</p>
|
||||
<ul class="links">
|
||||
<li class="d-none js-back-link">
|
||||
<a href="javascript:history.back()">Back</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/">Home</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="error">
|
||||
<div class="error-artwork-container">
|
||||
<picture>
|
||||
<source
|
||||
srcset="/images/errors/small/404.png 576w,
|
||||
/images/errors/medium/404.png 768w,
|
||||
/images/errors/original/404.png 1200w">
|
||||
<img src="/images/errors/small/404.png"/>
|
||||
</picture>
|
||||
</div>
|
||||
<div class="error-text-container">
|
||||
<h1>
|
||||
<span class="text-primary font-weight-bold">404</span>
|
||||
<small class="text-muted">Page not found</small>
|
||||
</h1>
|
||||
<p>
|
||||
Whatever you might have been looking for, it's not here.
|
||||
</p>
|
||||
<ul class="links">
|
||||
<li class="d-none js-back-link">
|
||||
<a href="javascript:history.back()">Back</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/">Home</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
if (window.history.length > 0) {
|
||||
|
|
|
|||
|
|
@ -82,7 +82,11 @@
|
|||
max-width: 100%;
|
||||
}
|
||||
|
||||
@media (min-width: 576px) {
|
||||
.error-text-container {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
body {
|
||||
padding: 3rem 1rem 1rem 1rem;
|
||||
}
|
||||
|
|
@ -92,54 +96,62 @@
|
|||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
@media (min-width: 992px) {
|
||||
body {
|
||||
padding: 5rem 1rem 3rem 1rem;
|
||||
}
|
||||
|
||||
.error-artwork-container picture {
|
||||
width: 768px;
|
||||
.error {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.error-text-container {
|
||||
align-self: center;
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="error-artwork-container">
|
||||
<picture>
|
||||
<source
|
||||
srcset="/images/errors/small/404.png 576w,
|
||||
/images/errors/medium/404.png 768w,
|
||||
/images/errors/original/404.png 1200w">
|
||||
<img src="/images/errors/small/404.png"/>
|
||||
</picture>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<h1>
|
||||
<span class="text-primary font-weight-bold">422</span>
|
||||
<small class="text-muted">Unprocessable Entity</small>
|
||||
</h1>
|
||||
<p>
|
||||
Whatever your browser tried to send us, it was not right!
|
||||
</p>
|
||||
<p class="mb-0">
|
||||
<i>Please retry what you initially tried, and if the problem persists, don't hesitate to contact us!</i>
|
||||
</p>
|
||||
<ul class="links mt-0">
|
||||
<li>
|
||||
<a href="https://twitter.com/retrospring">Twitter</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://github.com/retrospring/retrospring">GitHub</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="links">
|
||||
<li class="d-none js-back-link">
|
||||
<a href="javascript:history.back()">Back</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/">Home</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="error">
|
||||
<div class="error-artwork-container">
|
||||
<picture>
|
||||
<source
|
||||
srcset="/images/errors/small/404.png 576w,
|
||||
/images/errors/medium/404.png 768w,
|
||||
/images/errors/original/404.png 1200w">
|
||||
<img src="/images/errors/small/404.png"/>
|
||||
</picture>
|
||||
</div>
|
||||
<div class="error-text-container">
|
||||
<h1>
|
||||
<span class="text-primary font-weight-bold">422</span>
|
||||
<small class="text-muted">Unprocessable Entity</small>
|
||||
</h1>
|
||||
<p>
|
||||
Whatever your browser tried to send us, it was not right.
|
||||
</p>
|
||||
<p class="mb-0">
|
||||
<i>Please retry what you just did. If the problem persists, don't hesitate to contact us:</i>
|
||||
</p>
|
||||
<ul class="links mt-0">
|
||||
<li>
|
||||
<a href="https://twitter.com/Retrospring">Twitter: @Retrospring</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://github.com/Retrospring/retrospring">GitHub</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="links">
|
||||
<li class="d-none js-back-link">
|
||||
<a href="javascript:history.back()">Back</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/">Home</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
if (window.history.length > 0) {
|
||||
|
|
|
|||
|
|
@ -82,7 +82,11 @@
|
|||
max-width: 100%;
|
||||
}
|
||||
|
||||
@media (min-width: 576px) {
|
||||
.error-text-container {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
body {
|
||||
padding: 3rem 1rem 1rem 1rem;
|
||||
}
|
||||
|
|
@ -92,54 +96,62 @@
|
|||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
@media (min-width: 992px) {
|
||||
body {
|
||||
padding: 5rem 1rem 3rem 1rem;
|
||||
}
|
||||
|
||||
.error-artwork-container picture {
|
||||
width: 768px;
|
||||
.error {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.error-text-container {
|
||||
align-self: center;
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="error-artwork-container">
|
||||
<picture>
|
||||
<source
|
||||
srcset="/images/errors/small/500.png 576w,
|
||||
/images/errors/medium/500.png 768w,
|
||||
/images/errors/original/500.png 1200w">
|
||||
<img src="/images/errors/small/500.png"/>
|
||||
</picture>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<h1>
|
||||
<span class="text-primary font-weight-bold">500</span>
|
||||
<small class="text-muted">Internal Server Error</small>
|
||||
</h1>
|
||||
<p>
|
||||
If this page shows up, something went wrong and we already sent out our army of raccoons to fix it!
|
||||
</p>
|
||||
<p class="mb-0">
|
||||
<i>We get notified about issues, but feel free to contact us:</i>
|
||||
</p>
|
||||
<ul class="links mt-0">
|
||||
<li>
|
||||
<a href="https://twitter.com/retrospring">Twitter</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://github.com/retrospring/retrospring">GitHub</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="links">
|
||||
<li class="d-none js-back-link">
|
||||
<a href="javascript:history.back()">Back</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/">Home</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="error">
|
||||
<div class="error-artwork-container">
|
||||
<picture>
|
||||
<source
|
||||
srcset="/images/errors/small/500.png 576w,
|
||||
/images/errors/medium/500.png 768w,
|
||||
/images/errors/original/500.png 1200w">
|
||||
<img src="/images/errors/small/500.png"/>
|
||||
</picture>
|
||||
</div>
|
||||
<div class="error-text-container">
|
||||
<h1>
|
||||
<span class="text-primary font-weight-bold">500</span>
|
||||
<small class="text-muted">Internal Server Error</small>
|
||||
</h1>
|
||||
<p>
|
||||
If this page shows up, something went wrong. We dispatched our army of raccoons to fix it.
|
||||
</p>
|
||||
<p class="mb-0">
|
||||
<i>We get notified about issues, but feel free to contact us:</i>
|
||||
</p>
|
||||
<ul class="links mt-0">
|
||||
<li>
|
||||
<a href="https://twitter.com/Retrospring">Twitter: @Retrospring</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://github.com/Retrospring/retrospring">GitHub</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="links">
|
||||
<li class="d-none js-back-link">
|
||||
<a href="javascript:history.back()">Back</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/">Home</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
if (window.history.length > 0) {
|
||||
|
|
|
|||
Loading…
Reference in New Issue