FreakU
/
Retrospring
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Adjust layout and apply text suggestions

This commit is contained in:
Andreas Nedbal 2022-01-01 18:00:58 +01:00 committed by Andreas Nedbal
parent 247d84415a
commit eed2640326
3 changed files with 146 additions and 110 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
public/404.html
View File

@ -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,18 +96,25 @@
}
}
@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">
<div class="error-artwork-container">
<picture>
<source
@ -113,13 +124,13 @@
<img src="/images/errors/small/404.png"/>
</picture>
</div>
<div class="text-center">
<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 searching for, it's not here!
Whatever you might have been looking for, it's not here.
</p>
<ul class="links">
<li class="d-none js-back-link">
@ -130,6 +141,7 @@
</li>
</ul>
</div>
</div>
<script>
if (window.history.length > 0) {
document.querySelector('.js-back-link').classList.toggle('d-none');

30
public/422.html
View File

@ -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,18 +96,25 @@
}
}
@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">
<div class="error-artwork-container">
<picture>
<source
@ -113,23 +124,23 @@
<img src="/images/errors/small/404.png"/>
</picture>
</div>
<div class="text-center">
<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!
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>
<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</a>
<a href="https://twitter.com/Retrospring">Twitter: @Retrospring</a>
</li>
<li>
<a href="https://github.com/retrospring/retrospring">GitHub</a>
<a href="https://github.com/Retrospring/retrospring">GitHub</a>
</li>
</ul>
<ul class="links">
@ -141,6 +152,7 @@
</li>
</ul>
</div>
</div>
<script>
if (window.history.length > 0) {
document.querySelector('.js-back-link').classList.toggle('d-none');

28
public/500.html
View File

@ -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,18 +96,25 @@
}
}
@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">
<div class="error-artwork-container">
<picture>
<source
@ -113,23 +124,23 @@
<img src="/images/errors/small/500.png"/>
</picture>
</div>
<div class="text-center">
<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 and we already sent out our army of raccoons to fix it!
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</a>
<a href="https://twitter.com/Retrospring">Twitter: @Retrospring</a>
</li>
<li>
<a href="https://github.com/retrospring/retrospring">GitHub</a>
<a href="https://github.com/Retrospring/retrospring">GitHub</a>
</li>
</ul>
<ul class="links">
@ -141,6 +152,7 @@
</li>
</ul>
</div>
</div>
<script>
if (window.history.length > 0) {
document.querySelector('.js-back-link').classList.toggle('d-none');