refactor: ♻️ better offline page

This commit is contained in:
ThatOneCalculator 2023-08-08 17:18:51 -07:00
parent 47fa0c68d9
commit dc8d17e50d
No known key found for this signature in database
GPG Key ID: 8703CACD01000000
2 changed files with 2 additions and 2 deletions

View File

@ -147,7 +147,7 @@
<span class="button-label-big">Refresh</span>
</button>
<p class="dont-worry">Don't worry, it's (probably) not your fault.</p>
<p>Please make sure your browser is up-to-date and any AdBlockers are off.</p>
<p>Please make sure your browser is up-to-date and any AdBlockers are off (given they can sometimes errouniously interfere with loading assets).</p>
<p>If the problem persists after refreshing, please contact your instance's administrator.<br>You may also try the following options:</p>
<a href="/flush">
<button class="button-small">

View File

@ -28,7 +28,7 @@ globalThis.addEventListener("activate", (ev) => {
});
function offlineContentHTML(): string {
return `<!doctype html>Offline. Service Worker @${_VERSION_} <button onclick="location.reload()">reload</button>`;
return `<!doctype html><meta charset=utf-8><title>Offline</title><style>*{font-family:BIZ UDGothic,Roboto,HelveticaNeue,Arial,sans-serif}body,html{background-color:#191724;color:#e0def4;justify-content:center;margin:auto;padding:10px;text-align:center}button{border-radius:999px;padding:0 12px 0 12px;border:none;cursor:pointer;margin-bottom:12px}.button-big{background:linear-gradient(90deg,#c4a7e7,#ebbcba);line-height:50px}.button-big:hover{background:#31748f}.button-label-big{color:#191724;font-weight:700;font-size:20px;padding:12px}.button-label-small{color:#9ccfd8;font-size:16px;padding:12px}p{font-size:16px}#msg,.dont-worry{font-size:18px}.icon-warning{color:#f6c177;height:4rem;padding-top:2rem}h1{font-size:32px}code{font-family:Fira,FiraCode,monospace}@media screen and (max-width:500px){details{width:50%}}</style><body><svg class=icon-warning class="icon icon-tabler icon-tabler-alert-triangle"fill=none stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2 viewBox="0 0 24 24"xmlns=http://www.w3.org/2000/svg><path d="M0 0h24v24H0z"fill=none stroke=none></path><path d="M12 9v2m0 4v.01"></path><path d="M5 19h14a2 2 0 0 0 1.84 -2.75l-7.1 -12.25a2 2 0 0 0 -3.5 0l-7.1 12.25a2 2 0 0 0 1.75 2.75"></path></svg><h1>Looks like you're offline!</h1><button class=button-big onclick=location.reload(!0)><span class=button-label-big>Refresh</span></button><p class=dont-worry>Looks like Firefish couldn't connect to the server, probably because your device is offline.<p>The installed Service Worker is version <code>${_VERSION_}</code>`;
}
globalThis.addEventListener("fetch", (ev) => {