mirror of
https://github.com/danbulant/console-hub
synced 2026-05-19 20:38:43 +00:00
114 lines
2.7 KiB
HTML
114 lines
2.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="cs" dir="ltr">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Console hub - offline</title>
|
|
</head>
|
|
<body>
|
|
<h1>
|
|
You appear to be offline
|
|
</h1>
|
|
<p>Checking connection...</p>
|
|
<div class="lds-ellipsis"><div></div><div></div><div></div><div></div></div>
|
|
<style>
|
|
@font-face {
|
|
font-family: 'Gilroy-bold';
|
|
src: url('Gilroy-ExtraBold.otf');
|
|
}
|
|
@font-face {
|
|
font-family: 'Open sans';
|
|
src: url('open-sans/OpenSans-Regular.ttf');
|
|
}
|
|
html, body{
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
body {
|
|
margin: 0;
|
|
overflow: hidden;
|
|
background: #5d75ad;
|
|
background: linear-gradient(190deg, rgba(108, 138, 207, 1) 0%, rgba(58,55,102,1) 100%);
|
|
}
|
|
p {
|
|
font-family: 'Open sans';
|
|
color: white;
|
|
position: fixed;
|
|
top: 50%;
|
|
left: 50%;
|
|
width: 180px;
|
|
height: 20px;
|
|
margin-top: -20px;
|
|
margin-left: -90px;
|
|
}
|
|
h1 {
|
|
position: fixed;
|
|
width: 360px;
|
|
height: 30px;
|
|
margin-top: -65px;
|
|
margin-left: -180px;
|
|
left: 50%;
|
|
top: 50%;
|
|
font-family: 'Gilroy-bold', sans-serif;
|
|
color: white;
|
|
}
|
|
.lds-ellipsis {
|
|
margin: auto;
|
|
display: block;
|
|
position: fixed;
|
|
top: 47%;
|
|
left: 47%;
|
|
width: 64px;
|
|
height: 64px;
|
|
}
|
|
.lds-ellipsis div {
|
|
position: absolute;
|
|
top: 27px;
|
|
width: 11px;
|
|
height: 11px;
|
|
border-radius: 50%;
|
|
background: #c4c4c4;
|
|
animation-timing-function: cubic-bezier(0, 1, 1, 0);
|
|
}
|
|
.lds-ellipsis div:nth-child(1) {
|
|
left: 6px;
|
|
animation: lds-ellipsis1 0.6s infinite;
|
|
}
|
|
.lds-ellipsis div:nth-child(2) {
|
|
left: 6px;
|
|
animation: lds-ellipsis2 0.6s infinite;
|
|
}
|
|
.lds-ellipsis div:nth-child(3) {
|
|
left: 26px;
|
|
animation: lds-ellipsis2 0.6s infinite;
|
|
}
|
|
.lds-ellipsis div:nth-child(4) {
|
|
left: 45px;
|
|
animation: lds-ellipsis3 0.6s infinite;
|
|
}
|
|
@keyframes lds-ellipsis1 {
|
|
0% {
|
|
transform: scale(0);
|
|
}
|
|
100% {
|
|
transform: scale(1);
|
|
}
|
|
}
|
|
@keyframes lds-ellipsis3 {
|
|
0% {
|
|
transform: scale(1);
|
|
}
|
|
100% {
|
|
transform: scale(0);
|
|
}
|
|
}
|
|
@keyframes lds-ellipsis2 {
|
|
0% {
|
|
transform: translate(0, 0);
|
|
}
|
|
100% {
|
|
transform: translate(19px, 0);
|
|
}
|
|
}
|
|
</style>
|
|
</body>
|
|
</html>
|