This commit is contained in:
145
public/404.html
Normal file
145
public/404.html
Normal file
@@ -0,0 +1,145 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>We can’t find that (404)</title>
|
||||
<meta charset="UTF-8">
|
||||
<style>
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
--lch-black: 0% 0 0;
|
||||
--lch-gray: 75% 0.005 96;
|
||||
--lch-white: 100% 0 0;
|
||||
|
||||
--color-border: oklch(var(--lch-gray));
|
||||
--color-bg: oklch(var(--lch-white));
|
||||
--color-text: oklch(var(--lch-black));
|
||||
|
||||
--btn-size: 2.65em;
|
||||
|
||||
background-color: var(--color-bg);
|
||||
block-size: 100dvh;
|
||||
color: var(--color-text);
|
||||
display: grid;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
place-items: center;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
--lch-black: 100% 0 0;
|
||||
--lch-gray: 44.95% 0 0;
|
||||
--lch-white: 0% 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
svg {
|
||||
fill: var(--color-text);
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
fill: var(--color-text);
|
||||
}
|
||||
}
|
||||
|
||||
.error {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2em;
|
||||
justify-content: start;
|
||||
margin-block-end: 15dvh;
|
||||
}
|
||||
|
||||
.error__img {
|
||||
aspect-ratio: 1;
|
||||
background-color: var(--color-text);
|
||||
block-size: auto;
|
||||
border-radius: 50%;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
inline-size: 30dvh;
|
||||
|
||||
svg {
|
||||
fill: var(--color-bg);
|
||||
grid-area: 1/1;
|
||||
max-inline-size: 66%;
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
fill: var(--color-bg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 1em;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.btn {
|
||||
align-items: center;
|
||||
aspect-ratio: 1;
|
||||
background-color: var(--color-bg);
|
||||
block-size: var(--btn-size);
|
||||
border-radius: 50%;
|
||||
border: 1px solid var(--color-border);
|
||||
color: var(--color-text);
|
||||
cursor: pointer;
|
||||
display: grid;
|
||||
font-weight: 600;
|
||||
font-size: 1.4rem;
|
||||
gap: 0.5em;
|
||||
inline-size: var(--btn-size);
|
||||
justify-content: center;
|
||||
padding: 0;
|
||||
place-items: center;
|
||||
text-align: center;
|
||||
|
||||
svg {
|
||||
-webkit-touch-callout: none;
|
||||
grid-area: 1/1;
|
||||
inline-size: 1.3em;
|
||||
max-inline-size: unset;
|
||||
user-select: none;
|
||||
}
|
||||
}
|
||||
|
||||
.for-screen-reader {
|
||||
clip-path: inset(50%);
|
||||
height: 1px;
|
||||
width: 1px;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="error">
|
||||
<div class="error__img">
|
||||
<svg enable-background="new 0 0 24 24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-label="Not found">
|
||||
<path
|
||||
d="m24 4.8c0-1.7-1.3-3-3-3h-18c-1.7 0-3 1.3-3 3v14.5c0 1.7 1.3 3 3 3h18c1.7 0 3-1.3 3-3zm-14.3-1c.3-.5.8-.6 1.3-.4.2.1.3.2.4.4.1.1.1.3.2.5 0 .2-.1.4-.2.5-.3.5-.8.6-1.3.4-.2-.2-.4-.3-.4-.4-.1-.2-.2-.4-.2-.6 0-.1.1-.3.2-.4zm-3.5 0c.2-.5.8-.7 1.3-.4.2.1.3.2.4.4 0 .1.1.3.1.4 0 .2-.1.4-.2.5-.2.5-.8.7-1.3.4-.1-.1-.3-.2-.3-.3-.1-.2-.2-.4-.2-.6 0-.1.1-.3.2-.4zm-3.6 0c.2-.4.5-.6.9-.6s.7.2.8.5c.1.1.1.3.2.5 0 .2-.1.4-.2.5-.2.5-.8.7-1.3.4-.1-.1-.3-.2-.3-.3-.1-.2-.2-.4-.2-.6 0-.1 0-.2.1-.4zm19.4 15.4c0 .6-.4 1-1 1h-18c-.6 0-1-.4-1-1v-12.2c0-.1.1-.2.2-.2h19.5c.2 0 .3.1.3.2z" />
|
||||
<path
|
||||
d="m16.4 10.9c.2-.2.2-.6 0-.9l-.9-.9c-.2-.2-.6-.2-.9 0l-2.6 2.6h-.1l-2.5-2.6c-.2-.2-.6-.2-.9 0l-.9.9c-.2.2-.2.6 0 .9l2.6 2.6v.1l-2.6 2.6c-.2.2-.2.6 0 .9l.9.9c.2.2.6.2.9 0l2.6-2.6h.1l2.6 2.6c.2.2.6.2.9 0l.9-.9c.2-.2.2-.6 0-.9l-2.6-2.6v-.1z" />
|
||||
</svg>
|
||||
</div>
|
||||
<a href="/" class="btn" autofocus="true">
|
||||
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="m21.864 9.5h-11.607a.25.25 0 0 1 -.174-.43l3.864-3.721a2.609 2.609 0 0 0 -.075-3.682 2.612 2.612 0 0 0 -3.68-.077l-9.792 9.699a1 1 0 0 0 -.008 1.411l9.625 9.724a2.66 2.66 0 0 0 3.755-3.757l-3.729-3.733a.25.25 0 0 1 .177-.427h11.673c1.556 0 2-1.675 2-2.51a2.28 2.28 0 0 0 -2.029-2.497z" />
|
||||
</svg>
|
||||
<span class="for-screen-reader">Go back</span>
|
||||
</a>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
156
public/406-unsupported-browser.html
Normal file
156
public/406-unsupported-browser.html
Normal file
@@ -0,0 +1,156 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Your browser is not supported (406)</title>
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||||
<meta charset="UTF-8">
|
||||
<style>
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
--lch-black: 0% 0 0;
|
||||
--lch-gray: 75% 0.005 96;
|
||||
--lch-white: 100% 0 0;
|
||||
|
||||
--color-border: oklch(var(--lch-gray));
|
||||
--color-bg: oklch(var(--lch-white));
|
||||
--color-text: oklch(var(--lch-black));
|
||||
|
||||
--btn-size: 2.65em;
|
||||
|
||||
background-color: var(--color-bg);
|
||||
block-size: 100dvh;
|
||||
color: var(--color-text);
|
||||
display: grid;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
place-items: center;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
--lch-black: 100% 0 0;
|
||||
--lch-gray: 44.95% 0 0;
|
||||
--lch-white: 0% 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
svg {
|
||||
fill: var(--color-text);
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
fill: var(--color-text);
|
||||
}
|
||||
}
|
||||
|
||||
.error {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2em;
|
||||
justify-content: start;
|
||||
margin-block: 2dvh 15dvh;
|
||||
}
|
||||
|
||||
.error__img {
|
||||
aspect-ratio: 1;
|
||||
background-color: var(--color-text);
|
||||
block-size: auto;
|
||||
border-radius: 50%;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
inline-size: 30dvh;
|
||||
|
||||
svg {
|
||||
fill: var(--color-bg);
|
||||
grid-area: 1/1;
|
||||
max-inline-size: 66%;
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
fill: var(--color-bg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
max-inline-size: 50ch;
|
||||
padding: 0 3dvw;
|
||||
margin-inline: auto;
|
||||
}
|
||||
|
||||
.buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 1em;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.btn {
|
||||
align-items: center;
|
||||
aspect-ratio: 1;
|
||||
background-color: var(--color-bg);
|
||||
block-size: var(--btn-size);
|
||||
border-radius: 50%;
|
||||
border: 1px solid var(--color-border);
|
||||
color: var(--color-text);
|
||||
cursor: pointer;
|
||||
display: grid;
|
||||
font-weight: 600;
|
||||
font-size: 1.4rem;
|
||||
gap: 0.5em;
|
||||
inline-size: var(--btn-size);
|
||||
justify-content: center;
|
||||
padding: 0;
|
||||
place-items: center;
|
||||
text-align: center;
|
||||
|
||||
svg {
|
||||
-webkit-touch-callout: none;
|
||||
grid-area: 1/1;
|
||||
inline-size: 1.3em;
|
||||
max-inline-size: unset;
|
||||
user-select: none;
|
||||
}
|
||||
}
|
||||
|
||||
.for-screen-reader {
|
||||
clip-path: inset(50%);
|
||||
height: 1px;
|
||||
width: 1px;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="error">
|
||||
<div class="error__img">
|
||||
<svg enable-background="new 0 0 24 24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-label="Your browser is not supported">
|
||||
<path d="m17.2 14.4c.1-.8.2-1.6.2-2.4s-.1-1.6-.2-2.4h4.1c.2.8.3 1.6.3 2.4s-.1 1.6-.3 2.4m-6.2 6.7c.7-1.3 1.3-2.8 1.7-4.3h3.5c-1.1 2-3 3.5-5.2 4.3m-.3-6.7h-5.6c-.1-.8-.2-1.6-.2-2.4s.1-1.6.2-2.4h5.6c.1.8.2 1.6.2 2.4s-.1 1.6-.2 2.4m-2.8 7.2c-1-1.4-1.8-3-2.3-4.8h4.6c-.5 1.7-1.3 3.3-2.3 4.8m-4.8-14.4h-3.5c1.1-2 3-3.5 5.2-4.3-.7 1.4-1.3 2.8-1.7 4.3m-3.5 9.6h3.5c.4 1.5 1 2.9 1.7 4.3-2.2-.8-4.1-2.3-5.2-4.3m-1-2.4c-.2-.8-.3-1.6-.3-2.4s.1-1.6.3-2.4h4.1c-.1.8-.2 1.6-.2 2.4s.1 1.6.2 2.4m5.2-12c1 1.4 1.8 3 2.3 4.8h-4.6c.5-1.7 1.3-3.3 2.3-4.8m8.3 4.8h-3.5c-.4-1.5-.9-2.9-1.7-4.3 2.2.8 4.1 2.3 5.2 4.3m-8.3-7.2c-6.6 0-12 5.4-12 12s5.4 12 12 12 12-5.4 12-12-5.4-12-12-12z"/>
|
||||
</svg>
|
||||
</div>
|
||||
<a href="/" class="btn" autofocus="true">
|
||||
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="m21.864 9.5h-11.607a.25.25 0 0 1 -.174-.43l3.864-3.721a2.609 2.609 0 0 0 -.075-3.682 2.612 2.612 0 0 0 -3.68-.077l-9.792 9.699a1 1 0 0 0 -.008 1.411l9.625 9.724a2.66 2.66 0 0 0 3.755-3.757l-3.729-3.733a.25.25 0 0 1 .177-.427h11.673c1.556 0 2-1.675 2-2.51a2.28 2.28 0 0 0 -2.029-2.497z" />
|
||||
</svg>
|
||||
<span class="for-screen-reader">Go back</span>
|
||||
</a>
|
||||
<div>
|
||||
<p>🇺🇸 Upgrade to a supported web browser. Writebook requires a modern web browser. Please use one of the browsers listed below and make sure auto-updates are enabled.</p>
|
||||
<p>🇪🇸 Actualiza a un navegador web compatible. Writebook requiere un navegador web moderno. Utiliza uno de los navegadores listados a continuación y asegúrate de que las actualizaciones automáticas estén habilitadas.</p>
|
||||
<p>🇫🇷 Mettez à jour vers un navigateur web pris en charge. Writebook nécessite un navigateur web moderne. Veuillez utiliser l'un des navigateurs répertoriés ci-dessous et assurez-vous que les mises à jour automatiques sont activées.</p>
|
||||
<p>🇮🇳 समर्थित वेब ब्राउज़र में अपग्रेड करें। Writebook को एक आधुनिक वेब ब्राउज़र की आवश्यकता है। कृपया नीचे सूचीबद्ध ब्राउज़रों में से कोई एक का उपयोग करें और सुनिश्चित करें कि स्वचालित अपडेट्स सक्षम हैं।</p>
|
||||
<p>🇩🇪 Aktualisieren Sie auf einen unterstützten Webbrowser. Writebook erfordert einen modernen Webbrowser. Verwenden Sie bitte einen der unten aufgeführten Browser und stellen Sie sicher, dass automatische Updates aktiviert sind.</p>
|
||||
<p>🇧🇷 Atualize para um navegador compatível. O Writebook requer um navegador moderno. Por favor, use um dos navegadores listados abaixo e certifique-se de que as atualizações automáticas estão ativadas.</p>
|
||||
<p><strong>Safari 17.2+, Chrome 119+, Firefox 121+, Opera 104+</strong></p>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
159
public/422.html
Normal file
159
public/422.html
Normal file
@@ -0,0 +1,159 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>That didn’t work (422)</title>
|
||||
<meta charset="UTF-8">
|
||||
<style>
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
--lch-black: 0% 0 0;
|
||||
--lch-gray: 75% 0.005 96;
|
||||
--lch-white: 100% 0 0;
|
||||
|
||||
--color-border: oklch(var(--lch-gray));
|
||||
--color-bg: oklch(var(--lch-white));
|
||||
--color-text: oklch(var(--lch-black));
|
||||
|
||||
--btn-size: 2.65em;
|
||||
|
||||
background-color: var(--color-bg);
|
||||
block-size: 100dvh;
|
||||
color: var(--color-text);
|
||||
display: grid;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
place-items: center;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
--lch-black: 100% 0 0;
|
||||
--lch-gray: 44.95% 0 0;
|
||||
--lch-white: 0% 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
svg {
|
||||
fill: var(--color-text);
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
fill: var(--color-text);
|
||||
}
|
||||
}
|
||||
|
||||
.error {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2em;
|
||||
justify-content: start;
|
||||
margin-block-end: 15dvh;
|
||||
}
|
||||
|
||||
.error__img {
|
||||
aspect-ratio: 1;
|
||||
background-color: var(--color-text);
|
||||
block-size: auto;
|
||||
border-radius: 50%;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
inline-size: 30dvh;
|
||||
|
||||
svg {
|
||||
fill: var(--color-bg);
|
||||
grid-area: 1/1;
|
||||
max-inline-size: 66%;
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
fill: var(--color-bg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 1em;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.btn {
|
||||
align-items: center;
|
||||
aspect-ratio: 1;
|
||||
background-color: var(--color-bg);
|
||||
block-size: var(--btn-size);
|
||||
border-radius: 50%;
|
||||
border: 1px solid var(--color-border);
|
||||
color: var(--color-text);
|
||||
cursor: pointer;
|
||||
display: grid;
|
||||
font-weight: 600;
|
||||
font-size: 1.4rem;
|
||||
gap: 0.5em;
|
||||
inline-size: var(--btn-size);
|
||||
justify-content: center;
|
||||
padding: 0;
|
||||
place-items: center;
|
||||
text-align: center;
|
||||
|
||||
svg {
|
||||
-webkit-touch-callout: none;
|
||||
grid-area: 1/1;
|
||||
inline-size: 1.3em;
|
||||
max-inline-size: unset;
|
||||
user-select: none;
|
||||
}
|
||||
}
|
||||
|
||||
.for-screen-reader {
|
||||
clip-path: inset(50%);
|
||||
height: 1px;
|
||||
width: 1px;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
white-space: nowrap;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="error">
|
||||
<div class="error__img">
|
||||
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" aria-label="That didn’t work" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
|
||||
y="0px" viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve">
|
||||
<g>
|
||||
<circle cx="11.5" cy="11.5" r="1.8" />
|
||||
<path d="M12.2,18.7c-0.2,0-0.5,0-0.7,0c-4,0-7.2-3.2-7.2-7.2c0-4,3.2-7.2,7.2-7.2c4,0,7.2,3.2,7.2,7.2c0,1-0.2,1.9-0.5,2.7l0.3-0.3
|
||||
c0-1.3,0.8-2.5,2-3c-0.3-4.7-4.2-8.4-9-8.4c-5,0-9,4-9,9c0,4.6,3.5,8.5,8,9L12.2,18.7z" />
|
||||
<path d="M11.5,6.1c-3,0-5.4,2.4-5.4,5.4s2.4,5.4,5.4,5.4s5.4-2.4,5.4-5.4S14.5,6.1,11.5,6.1z M11.5,15.1c-2,0-3.6-1.6-3.6-3.6
|
||||
s1.6-3.6,3.6-3.6s3.6,1.6,3.6,3.6S13.5,15.1,11.5,15.1z" />
|
||||
</g>
|
||||
<path d="M15,24l4-4v-1.5l2.6-2.6C21.7,16,21.9,16,22,16c1.1,0,2-0.9,2-2s-0.9-2-2-2c-1.1,0-2,0.9-2,2c0,0.1,0,0.3,0.1,0.4L17.5,17
|
||||
H16l-4,4h3V24" />
|
||||
</svg>
|
||||
</div>
|
||||
<div class="buttons">
|
||||
<a href="/" class="btn" autofocus="true">
|
||||
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="m21.864 9.5h-11.607a.25.25 0 0 1 -.174-.43l3.864-3.721a2.609 2.609 0 0 0 -.075-3.682 2.612 2.612 0 0 0 -3.68-.077l-9.792 9.699a1 1 0 0 0 -.008 1.411l9.625 9.724a2.66 2.66 0 0 0 3.755-3.757l-3.729-3.733a.25.25 0 0 1 .177-.427h11.673c1.556 0 2-1.675 2-2.51a2.28 2.28 0 0 0 -2.029-2.497z" />
|
||||
</svg>
|
||||
<span class="for-screen-reader">Go back</span>
|
||||
</a>
|
||||
<a href="#" class="btn" autofocus="true" onclick="window.location.reload()">
|
||||
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="m6.177 6.167a8.233 8.233 0 0 1 8.351-2.027 1.249 1.249 0 1 0 .76-2.38 10.751 10.751 0 0 0 -13.242 14.273.248.248 0 0 1 -.094.3l-1.4.922a1 1 0 0 0 .348 1.816l4.407.908a.99.99 0 0 0 .2.021 1 1 0 0 0 .979-.8l.914-4.406a1 1 0 0 0 -1.529-1.037l-1.339.881a.25.25 0 0 1 -.376-.133 8.269 8.269 0 0 1 2.021-8.338z" />
|
||||
<path
|
||||
d="m23.883 5.832a1 1 0 0 0 -.763-.807l-4.388-1a1 1 0 0 0 -1.2.752l-1 4.387a1 1 0 0 0 1.507 1.069l1.443-.906a.247.247 0 0 1 .218-.027.252.252 0 0 1 .153.159 8.249 8.249 0 0 1 -10.285 10.424 1.25 1.25 0 1 0 -.737 2.388 10.75 10.75 0 0 0 13.154-14.271.248.248 0 0 1 .1-.3l1.346-.846a1 1 0 0 0 .452-1.022z" />
|
||||
</svg>
|
||||
<span class="for-screen-reader">Try again</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
147
public/500.html
Normal file
147
public/500.html
Normal file
@@ -0,0 +1,147 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Something went wrong (500)</title>
|
||||
<meta charset="UTF-8">
|
||||
<style>
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
--lch-black: 0% 0 0;
|
||||
--lch-gray: 75% 0.005 96;
|
||||
--lch-white: 100% 0 0;
|
||||
|
||||
--color-border: oklch(var(--lch-gray));
|
||||
--color-bg: oklch(var(--lch-white));
|
||||
--color-text: oklch(var(--lch-black));
|
||||
|
||||
--btn-size: 2.65em;
|
||||
|
||||
background-color: var(--color-bg);
|
||||
block-size: 100dvh;
|
||||
color: var(--color-text);
|
||||
display: grid;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
place-items: center;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
--lch-black: 100% 0 0;
|
||||
--lch-gray: 44.95% 0 0;
|
||||
--lch-white: 0% 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
svg {
|
||||
fill: var(--color-text);
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
fill: var(--color-text);
|
||||
}
|
||||
}
|
||||
|
||||
.error {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2em;
|
||||
justify-content: start;
|
||||
margin-block-end: 15dvh;
|
||||
}
|
||||
|
||||
.error__img {
|
||||
aspect-ratio: 1;
|
||||
background-color: var(--color-text);
|
||||
block-size: auto;
|
||||
border-radius: 50%;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
inline-size: 30dvh;
|
||||
|
||||
svg {
|
||||
fill: var(--color-bg);
|
||||
grid-area: 1/1;
|
||||
max-inline-size: 66%;
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
fill: var(--color-bg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 1em;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.btn {
|
||||
align-items: center;
|
||||
aspect-ratio: 1;
|
||||
background-color: var(--color-bg);
|
||||
block-size: var(--btn-size);
|
||||
border-radius: 50%;
|
||||
border: 1px solid var(--color-border);
|
||||
color: var(--color-text);
|
||||
cursor: pointer;
|
||||
display: grid;
|
||||
font-weight: 600;
|
||||
font-size: 1.4rem;
|
||||
gap: 0.5em;
|
||||
inline-size: var(--btn-size);
|
||||
justify-content: center;
|
||||
padding: 0;
|
||||
place-items: center;
|
||||
text-align: center;
|
||||
|
||||
svg {
|
||||
-webkit-touch-callout: none;
|
||||
grid-area: 1/1;
|
||||
inline-size: 1.3em;
|
||||
max-inline-size: unset;
|
||||
user-select: none;
|
||||
}
|
||||
}
|
||||
|
||||
.for-screen-reader {
|
||||
clip-path: inset(50%);
|
||||
height: 1px;
|
||||
width: 1px;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
white-space: nowrap;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="error">
|
||||
<div class="error__img">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-label="Server error">
|
||||
<title>server-warning</title>
|
||||
<path
|
||||
d="M2.5,6h17A2.5,2.5,0,0,0,22,3.5v-1A2.5,2.5,0,0,0,19.5,0H2.5A2.5,2.5,0,0,0,0,2.5v1A2.5,2.5,0,0,0,2.5,6ZM3.635,3A1.115,1.115,0,1,1,4.749,4.114,1.114,1.114,0,0,1,3.635,3ZM7.5,3A1.115,1.115,0,1,1,8.614,4.114,1.115,1.115,0,0,1,7.5,3Z" />
|
||||
<path
|
||||
d="M14.892,11.574a2.952,2.952,0,0,1,3.339-1.486,3.061,3.061,0,0,1,1.934,1.59l.26.495a.5.5,0,0,0,.765.154A2.468,2.468,0,0,0,22,10.5v-1A2.5,2.5,0,0,0,19.5,7H2.5A2.5,2.5,0,0,0,0,9.5v1A2.5,2.5,0,0,0,2.5,13H13.842a.5.5,0,0,0,.442-.268ZM9.729,10A1.115,1.115,0,1,1,8.614,8.885,1.115,1.115,0,0,1,9.729,10ZM5.864,10A1.115,1.115,0,1,1,4.749,8.885,1.115,1.115,0,0,1,5.864,10Z" />
|
||||
<path
|
||||
d="M2.5,20h7.67a.5.5,0,0,0,.442-.268l2.624-5A.5.5,0,0,0,12.792,14H2.5A2.5,2.5,0,0,0,0,16.5v1A2.5,2.5,0,0,0,2.5,20Zm1.136-3a1.115,1.115,0,1,1,1.114,1.115A1.114,1.114,0,0,1,3.635,17ZM7.5,17a1.115,1.115,0,1,1,1.115,1.115A1.115,1.115,0,0,1,7.5,17Z" />
|
||||
<path
|
||||
d="M11.165,21.905a1.429,1.429,0,0,0,.048,1.408A1.453,1.453,0,0,0,12.446,24H22.558a1.455,1.455,0,0,0,1.232-.687,1.429,1.429,0,0,0,.048-1.408l-5.055-9.634a1.45,1.45,0,0,0-2.562,0ZM17.5,14.75a.75.75,0,0,1,.75.75v3a.75.75,0,0,1-1.5,0v-3A.75.75,0,0,1,17.5,14.75Zm1,6.5a1,1,0,1,1-1-1A1,1,0,0,1,18.5,21.25Z" />
|
||||
</svg>
|
||||
</div>
|
||||
<a href="/" class="btn" autofocus="true">
|
||||
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="m21.864 9.5h-11.607a.25.25 0 0 1 -.174-.43l3.864-3.721a2.609 2.609 0 0 0 -.075-3.682 2.612 2.612 0 0 0 -3.68-.077l-9.792 9.699a1 1 0 0 0 -.008 1.411l9.625 9.724a2.66 2.66 0 0 0 3.755-3.757l-3.729-3.733a.25.25 0 0 1 .177-.427h11.673c1.556 0 2-1.675 2-2.51a2.28 2.28 0 0 0 -2.029-2.497z" />
|
||||
</svg>
|
||||
<span class="for-screen-reader">Go back</span>
|
||||
</a>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
127
public/502.html
Normal file
127
public/502.html
Normal file
File diff suppressed because one or more lines are too long
BIN
public/app-icon-192.png
Normal file
BIN
public/app-icon-192.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
BIN
public/app-icon.png
Normal file
BIN
public/app-icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 118 KiB |
BIN
public/favicon.png
Normal file
BIN
public/favicon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 277 B |
1
public/favicon.svg
Normal file
1
public/favicon.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 16 KiB |
1
public/robots.txt
Normal file
1
public/robots.txt
Normal file
@@ -0,0 +1 @@
|
||||
# See https://www.robotstxt.org/robotstxt.html for documentation on how to use the robots.txt file
|
||||
Reference in New Issue
Block a user