mirrors/retrospring
1
0
Fork 0
mirror of https://github.com/Retrospring/retrospring.git synced 2025-02-12 09:43:36 +01:00
Code Issues Projects Releases Packages Wiki Activity

Adjust layout and apply text suggestions

Browse source
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> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>Page not found!</title> <title>Page not found</title>
<meta name="viewport" content="width=device-width,initial-scale=1"> <meta name="viewport" content="width=device-width,initial-scale=1">
<style> <style>
:root { :root {
@ -82,7 +82,11 @@
max-width: 100%; max-width: 100%;
} }
@media (min-width: 576px) { .error-text-container {
text-align: center;
}
@media (min-width: 768px) {
body { body {
padding: 3rem 1rem 1rem 1rem; padding: 3rem 1rem 1rem 1rem;
} }
@ -92,18 +96,25 @@
} }
} }
@media (min-width: 768px) { @media (min-width: 992px) {
body { body {
padding: 5rem 1rem 3rem 1rem; padding: 5rem 1rem 3rem 1rem;
} }
.error-artwork-container picture { .error {
width: 768px; display: flex;
justify-content: center;
}
.error-text-container {
align-self: center;
text-align: left;
} }
} }
</style> </style>
</head> </head>
<body> <body>
<div class="error">
<div class="error-artwork-container"> <div class="error-artwork-container">
<picture> <picture>
<source <source
@ -113,13 +124,13 @@
<img src="/images/errors/small/404.png"/> <img src="/images/errors/small/404.png"/>
</picture> </picture>
</div> </div>
<div class="text-center"> <div class="error-text-container">
<h1> <h1>
<span class="text-primary font-weight-bold">404</span> <span class="text-primary font-weight-bold">404</span>
<small class="text-muted">Page not found</small> <small class="text-muted">Page not found</small>
</h1> </h1>
<p> <p>
Whatever you might have been searching for, it's not here! Whatever you might have been looking for, it's not here.
</p> </p>
<ul class="links"> <ul class="links">
<li class="d-none js-back-link"> <li class="d-none js-back-link">
@ -130,6 +141,7 @@
</li> </li>
</ul> </ul>
</div> </div>
</div>
<script> <script>
if (window.history.length > 0) { if (window.history.length > 0) {
document.querySelector('.js-back-link').classList.toggle('d-none'); document.querySelector('.js-back-link').classList.toggle('d-none');

30
public/422.html
View file

@ -82,7 +82,11 @@
max-width: 100%; max-width: 100%;
} }
@media (min-width: 576px) { .error-text-container {
text-align: center;
}
@media (min-width: 768px) {
body { body {
padding: 3rem 1rem 1rem 1rem; padding: 3rem 1rem 1rem 1rem;
} }
@ -92,18 +96,25 @@
} }
} }
@media (min-width: 768px) { @media (min-width: 992px) {
body { body {
padding: 5rem 1rem 3rem 1rem; padding: 5rem 1rem 3rem 1rem;
} }
.error-artwork-container picture { .error {
width: 768px; display: flex;
justify-content: center;
}
.error-text-container {
align-self: center;
text-align: left;
} }
} }
</style> </style>
</head> </head>
<body> <body>
<div class="error">
<div class="error-artwork-container"> <div class="error-artwork-container">
<picture> <picture>
<source <source
@ -113,23 +124,23 @@
<img src="/images/errors/small/404.png"/> <img src="/images/errors/small/404.png"/>
</picture> </picture>
</div> </div>
<div class="text-center"> <div class="error-text-container">
<h1> <h1>
<span class="text-primary font-weight-bold">422</span> <span class="text-primary font-weight-bold">422</span>
<small class="text-muted">Unprocessable Entity</small> <small class="text-muted">Unprocessable Entity</small>
</h1> </h1>
<p> <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>
<p class="mb-0"> <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> </p>
<ul class="links mt-0"> <ul class="links mt-0">
<li> <li>
<a href="https://twitter.com/retrospring">Twitter</a> <a href="https://twitter.com/Retrospring">Twitter: @Retrospring</a>
</li> </li>
<li> <li>
<a href="https://github.com/retrospring/retrospring">GitHub</a> <a href="https://github.com/Retrospring/retrospring">GitHub</a>
</li> </li>
</ul> </ul>
<ul class="links"> <ul class="links">
@ -141,6 +152,7 @@
</li> </li>
</ul> </ul>
</div> </div>
</div>
<script> <script>
if (window.history.length > 0) { if (window.history.length > 0) {
document.querySelector('.js-back-link').classList.toggle('d-none'); document.querySelector('.js-back-link').classList.toggle('d-none');

28
public/500.html
View file

@ -82,7 +82,11 @@
max-width: 100%; max-width: 100%;
} }
@media (min-width: 576px) { .error-text-container {
text-align: center;
}
@media (min-width: 768px) {
body { body {
padding: 3rem 1rem 1rem 1rem; padding: 3rem 1rem 1rem 1rem;
} }
@ -92,18 +96,25 @@
} }
} }
@media (min-width: 768px) { @media (min-width: 992px) {
body { body {
padding: 5rem 1rem 3rem 1rem; padding: 5rem 1rem 3rem 1rem;
} }
.error-artwork-container picture { .error {
width: 768px; display: flex;
justify-content: center;
}
.error-text-container {
align-self: center;
text-align: left;
} }
} }
</style> </style>
</head> </head>
<body> <body>
<div class="error">
<div class="error-artwork-container"> <div class="error-artwork-container">
<picture> <picture>
<source <source
@ -113,23 +124,23 @@
<img src="/images/errors/small/500.png"/> <img src="/images/errors/small/500.png"/>
</picture> </picture>
</div> </div>
<div class="text-center"> <div class="error-text-container">
<h1> <h1>
<span class="text-primary font-weight-bold">500</span> <span class="text-primary font-weight-bold">500</span>
<small class="text-muted">Internal Server Error</small> <small class="text-muted">Internal Server Error</small>
</h1> </h1>
<p> <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>
<p class="mb-0"> <p class="mb-0">
<i>We get notified about issues, but feel free to contact us:</i> <i>We get notified about issues, but feel free to contact us:</i>
</p> </p>
<ul class="links mt-0"> <ul class="links mt-0">
<li> <li>
<a href="https://twitter.com/retrospring">Twitter</a> <a href="https://twitter.com/Retrospring">Twitter: @Retrospring</a>
</li> </li>
<li> <li>
<a href="https://github.com/retrospring/retrospring">GitHub</a> <a href="https://github.com/Retrospring/retrospring">GitHub</a>
</li> </li>
</ul> </ul>
<ul class="links"> <ul class="links">
@ -141,6 +152,7 @@
</li> </li>
</ul> </ul>
</div> </div>
</div>
<script> <script>
if (window.history.length > 0) { if (window.history.length > 0) {
document.querySelector('.js-back-link').classList.toggle('d-none'); document.querySelector('.js-back-link').classList.toggle('d-none');