pixelfed/public/offline.html

62 wiersze
11 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" type="text/css" href="/css/app.css">
<title>You are offline</title>
<style>
h1 {
text-align: center;
color: #000;
}
p {
text-align: center;
margin-block: 1rem;
}
button {
display: inline-block;
}
</style>
</head>
<body>
<div class="mt-5 pt-5">
<div>
<p>
<svg width="50px" height="50px" viewBox="0 0 50 50" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <title>icon/color/svg/pixelfed-icon-color</title> <desc>Created with Sketch.</desc> <defs> <rect id="path-1" x="0" y="0.112107623" width="50" height="49.7757848"></rect> <linearGradient x1="100%" y1="55.8067876%" x2="0%" y2="60.1177402%" id="linearGradient-3"> <stop stop-color="#FF5C34" offset="0%"></stop> <stop stop-color="#EB0256" offset="100%"></stop> </linearGradient> <linearGradient x1="33.0892153%" y1="100%" x2="68.9900955%" y2="15.3101693%" id="linearGradient-4"> <stop stop-color="#A63FDB" offset="0%"></stop> <stop stop-color="#FF257E" offset="100%"></stop> </linearGradient> <linearGradient x1="14.7223019%" y1="50%" x2="94.315299%" y2="67.5256558%" id="linearGradient-5"> <stop stop-color="#00FFF0" offset="0%"></stop> <stop stop-color="#0087FF" offset="100%"></stop> </linearGradient> <linearGradient x1="81.2260936%" y1="10.0128769%" x2="20.8151903%" y2="74.4920673%" id="linearGradient-6"> <stop stop-color="#17C934" offset="0%"></stop> <stop stop-color="#03FF6E" offset="100%"></stop> </linearGradient> <linearGradient x1="50%" y1="111.913008%" x2="30.5601577%" y2="0%" id="linearGradient-7"> <stop stop-color="#FFB000" offset="0%"></stop> <stop stop-color="#FF7725" offset="100%"></stop> </linearGradient> <path d="M25.8796198,24.6636771 C25.5187511,17.8623246 19.644178,12.6376937 12.7583935,12.9941375 C5.87260905,13.3505813 0.583119676,19.1531217 0.94398835,25.9544743 L0.954359402,26.1499392 C0.924772259,25.6582574 0.909768036,25.162698 0.909768036,24.6636771 C0.909768036,14.5077362 7.12441451,5.78550566 16.0023658,2.00478143 L16.5257487,1.7959139 C22.9188985,-0.755414121 30.1955057,2.29544903 32.7785059,8.61020748 C35.3615061,14.9249659 32.2727696,22.1123491 25.8796198,24.6636771 Z" id="path-8"></path> <path d="M16.3387661,1.87053346 L16.5257487,1.7959139 C22.9188985,-0.755414121 30.1955057,2.29544903 32.7785059,8.61020748 C35.3615061,14.9249659 32.2727696,22.1123491 25.8796198,24.6636771 C25.8261894,23.6566658 25.6518881,22.6842191 25.3713301,21.7593344 C28.8012958,19.9026454 31.1268503,16.3032843 31.1268503,12.167421 C31.1268503,6.13067623 26.1723508,1.23692769 20.060666,1.23692769 C18.7548626,1.23692769 17.5018839,1.46032366 16.3387661,1.87053346 Z" id="path-9"></path> <linearGradient x1="-81.3646199%" y1="59.6233723%" x2="121.418067%" y2="72.057922%" id="linearGradient-10"> <stop stop-color="#9EE85D" offset="0%"></stop> <stop stop-color="#0ED061" offset="100%"></stop> </linearGradient> <path d="M28.3794511,9.27014825 L28.5664337,9.1955287 C34.9595835,6.64420067 42.2361907,9.69506383 44.8191909,16.0098223 C47.4021911,22.3245807 44.3134546,29.5119639 37.9203048,32.0632919 C37.8668744,31.0562806 37.6925731,30.0838339 37.4120151,29.1589492 C40.8419808,27.3022602 43.1675353,23.7028991 43.1675353,19.5670358 C43.1675353,13.530291 38.2130358,8.63654249 32.101351,8.63654249 C30.7955476,8.63654249 29.5425689,8.85993845 28.3794511,9.27014825 Z" id="path-11"></path> <linearGradient x1="45.510285%" y1="116.818646%" x2="0%" y2="-4.0376427%" id="linearGradient-12"> <stop stop-color="#21EFE3" offset="0%"></stop> <stop stop-color="#2598FF" offset="100%"></stop> </linearGradient> <path d="M25.1352415,22.7323503 L25.3222242,22.6577307 C31.7153739,20.1064027 38.9919812,23.1572658 41.5749814,29.4720243 C44.1579816,35.7867827 41.069245,42.9741659 34.6760953,45.5254939 C34.6226649,44.5184826 34.4483636,43.5460359 34.1678055,42.6211512 C37.5977712,40.7644622 39.9233257,37.1651011 39.9233257,33.0292378 C39.9233257,26.992493 34.9688263,22.0987445 28.8571415,22.0987445 C27.5513381,22.0987445 26.2983594,22.3221405 25.1352415,22.7323503 Z" id="path-13"></path> <linearGradient x1="100%" y1="58.2065614%" x2="-89.649052%" y2="74.3165445%" id="linearGradient-14"> <stop stop-color="#A63FDB" offset="0%"></stop> <stop stop-color="#FF257E" offset="100%"></stop> </linearGradient> <path d="M10.6540931,23.7648224 L10.8410757,23.6902028 C17.2342255,21.1388748 24.5108328,24.1897379 27.093833,30.5044964 C29.6768331,36.8192548 26.5880966,44.006638 20.1949468,46.557966 C20.1415164,45.5509547 19.9672152,44.578508 19.6866571,43.6536233 C23.1166228,41.7969343 25.4421773,38.1975732 25.4421773,34.0617099 C25.4421773,28.0249651 20.4876778,23.1312166 14.375993,23.1312166 C13.0701896,23.1312166 11.8172109,23.3546126 10.6540931,23.7648224 Z" id="path-15"></path> <path d="M5.54585436,10.6972047 L5.73283698,10.6225852 C12.1259868,8.07125717 19.402594,11.1221203 21.9855942,17.4368788 C24.5685944,23.7516372 21.4798579,30.9390204 15.0867081,33.4903484 C15.0332777,32.483337 14.8589764,31.5108904 14.5784184,30.5860057 C18.0083841,28.7293167 20.3339386,25.1299556 20.3339386,20.9940923 C20.3339386,14.9573475 15.3794391,10.063599 9.26775427,10.063599 C7.9619509,10.063599 6.70897218,10.2869949 5.54585436,10.6972047 Z" id="path-16"></path> <path d="M35.631732,42.3730981 L40.1765635,42.3730981 C44.4579764,42.3730981 47.9287473,39.0094481 47.9287473,34.8601757 C47.9287473,30.7109033 44.4579764,27.3472534 40.1765635,27.3472534 L33.6170234,27.3472534 C31.1469775,27.3472534 29.1446097,29.2878206 29.1446097,31.6816316 L29.1446097,48.5516086 L35.631732,42.3730981 Z" id="path-17"></path> <filter x="-26.6%" y="-18.9%" width="153.2%" height="147.2%" filterUnits="objectBoundingBox" id="filter-18"> <feOffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset> <feGaussianBlur stdDeviation="1.5" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.298686594 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix> </filter> </defs> <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="icon-copy-9"> <g id="Group"> <mask id="mask-2" fill="white"> <use xlink:href="#path-1"></use> </mask> <g id="Rectangle"></g> <g id="Group-12" mask="url(#mask-2)"> <g transform="translate(-12.598536, -12.100617)"> <g id="Group-5" stroke-width="1" fill-rule="evenodd" transform="translate(37.298810, 37.253293) rotate(40.000000) translate(-37.298810, -37.253293) translate(11.517560, 12.253293)"> <path d="M25.8796198,24.6636771 C19.1892035,23.016023 12.4132807,27.0374857 10.7451726,33.6458656 C9.07706451,40.2542455 13.1484497,46.9470835 19.8388659,48.5947376 L20.3450373,48.7193929 C9.69088103,46.3380067 1.6209996,37.2282295 0.954359365,26.1499385 L0.94398835,25.9544743 C0.583119676,19.1531217 5.87260905,13.3505813 12.7583935,12.9941375 C19.644178,12.6376937 25.5187511,17.8623246 25.8796198,24.6636771 Z" id="Combined-Shape" fill="url(#linearGradient-3)"></path> <path d="M25.8796198,24.6636771 C22.3283116,30.5015748 24.2407085,38.0777295 30.1510778,41.5854923 C36.0614471,45.0932551 43.7316521,43.2043076 47.2829602,37.3664099 L47.5182297,36.9796568 C43.2031146,44.3603916 35.1286161,49.3273543 25.8796198,49.3273543 C23.9775953,49.3273543 22.125241,49.1172988 20.3450373,48.7193929 L19.8388659,48.5947376 C13.1484497,46.9470835 9.07706451,40.2542455 10.7451726,33.6458656 C12.4132807,27.0374857 19.1892035,23.016023 25.8796198,24.6636771 Z" id="Combined-Shape-Copy-6" fill="url(#linearGradient-4)"></path> <path d="M25.8796198,24.6636771 C30.3117909,29.8809656 38.1867277,30.5614853 43.4687835,26.1836605 C48.7508393,21.8058357 49.439807,14.0274595 45.0076359,8.81017106 L44.9061506,8.69070851 C48.612765,12.9940954 50.8494715,18.5708837 50.8494715,24.6636771 C50.8494715,29.1494627 49.6370515,33.3555446 47.5182297,36.9796568 L47.2829602,37.3664099 C43.7316521,43.2043076 36.0614471,45.0932551 30.1510778,41.5854923 C24.2407085,38.0777295 22.3283116,30.5015748 25.8796198,24.6636771 Z" id="Combined-Shape-Copy-5" fill="url(#linearGradient-5)"></path> <path d="M25.8796198,24.6636771 C32.2727696,22.1123491 35.3615061,14.9249659 32.7785059,8.61020748 C30.1955057,2.29544903 22.9188985,-0.755414121 16.5257487,1.7959139 L16.0023658,2.00478143 C19.0317193,0.714714639 22.3711681,0 25.8796198,0 C33.5016588,0 40.3260608,3.37321498 44.9061506,8.69070851 L45.0076359,8.81017106 C49.439807,14.0274595 48.7508393,21.8058357 43.4687835,26.1836605 C38.1867277,30.5614853 30.3117909,29.8809656 25.8796198,24.6636771 Z" id="Combined-Shape-Copy-4" fill="url(#linearGradient-6)"></path> <g id="Combined-Shape-Copy-3" fill="url(#linearGradient-7)"> <use xlink:href="#path-8"></use> <use fill-opacity="0.1" style="mix-blend-mode: multiply;" xlink:href="#path-8"></use> </g> <g id="Combined-Shape" opacity="0.504910714"> <use fill="url(#linearGradient-7)" xlink:href="#path-9"></use> <use fill-opacity="0.496178668" fill="#000000" style="mix-blend-mode: overlay;" xlink:href="#path-9"></use> </g> <g id="Combined-Shape-Copy-7" opacity="0.544252232" transform="translate(37.055527, 20.178799) rotate(72.000000) translate(-37.055527, -20.178799) "> <use fill="url(#linearGradient-10)" xlink:href="#path-11"></use> <use fill-opacity="0.499886775" fill="#000000" style="mix-blend-mode: overlay;" xlink:href="#path-11"></use> </g> <g id="Combined-Shape-Copy-8" opacity="0.562220982" transform="translate(33.811317, 33.641001) rotate(143.000000) translate(-33.811317, -33.641001) "> <use fill="url(#linearGradient-12)" xlink:href="#path-13"></use> <use fill="#000000" style="mix-blend-mode: overlay;" xlink:href="#path-13"></use> </g> <g id="Combined-Shape-Copy-9" opacity="0.584151786" transform="translate(19.330169, 34.673473) rotate(217.000000) translate(-19.330169, -34.673473) "> <use fill="url(#linearGradient-14)" xlink:href="#path-15"></use> <use fill-opacity="0.503085371" fill="#000000" style="mix-blend-mode: overlay;" xlink:href="#path-15"></use> </g> <g id="Combined-Shape-Copy-10" opacity="0.180133929" transform="translate(14.221930, 21.605855) rotate(-71.000000) translate(-14.221930, -21.605855) "> <use fill="url(#linearGradient-3)" xlink:href="#path-16"></use> <use fill-opacity="0.772843071" fill="#000000" style="mix-blend-mode: multiply;" xlink:href="#path-16"></use> </g> </g> <g id="Path-6-Copy-2" fill-rule="nonzero"> <use fill="black" fill-opacity="1" filter="url(#filter-18)" xlink:href="#path-17"></use> <use fill="#FFFFFF" xlink:href="#path-17"></use> </g> </g> </g> </g> </g> </g></svg>
</p>
<h1>You are offline</h1>
<p>Click the button below to try reloading.</p>
<p>
<button type="button" class="btn btn-outline-dark">⤾ Reload</button>
</p>
</div>
</div>
<script>
document.querySelector("button").addEventListener("click", () => {
window.location.reload();
});
window.addEventListener('online', () => {
window.location.reload();
});
async function checkNetworkAndReload() {
try {
const response = await fetch('.');
if (response.status >= 200 && response.status < 500) {
window.location.reload();
return;
}
} catch {
}
window.setTimeout(checkNetworkAndReload, 2500);
}
checkNetworkAndReload();
</script>
</body>
</html>