90 lines
No EOL
3.2 KiB
HTML
90 lines
No EOL
3.2 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<title>Scheduled Maintenance/</title>
|
|
<link rel="stylesheet" type="text/css" href="/maintenance-page/assets/asciinema-player.css" />
|
|
</head>
|
|
|
|
<body style="background-color: #121315; font-family: 'Fira Code', monospace;">
|
|
<div style="margin:0 !important; padding:0 !important;" id="player"></div>
|
|
<div class="info-container">
|
|
<p id="countdown" class="text-countdown"></p>
|
|
<p class="text-info">StP is undergoing maintenance! Here's an estimated time that we will be back up and running, thank you for your patience :)</p>
|
|
</div>
|
|
<script src="/maintenance-page/assets/asciinema-player.min.js"></script>
|
|
<script>
|
|
AsciinemaPlayer.create(
|
|
'/maintenance-page/assets/train.cast',
|
|
document.getElementById('player'), {
|
|
loop: true,
|
|
autoplay: true,
|
|
rows: 50,
|
|
theme: "asciinema",
|
|
}
|
|
);
|
|
</script>
|
|
<style>
|
|
.info-container {
|
|
flex-direction: column;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
.ap-control-bar {
|
|
opacity: 0 !important;
|
|
}
|
|
.text-countdown {
|
|
height: 2.5rem;
|
|
display: flex;
|
|
background-image: -moz-linear-gradient(top, #b8b0af 0%, #f2ecea 100%);
|
|
background-image: -webkit-linear-gradient(top, #b8b0af 0%, #f2ecea 100%);
|
|
background-image: -o-linear-gradient(top, #b8b0af 0%, #f2ecea 100%);
|
|
background-image: -ms-linear-gradient(top, #b8b0af 0%, #f2ecea 100%);
|
|
background-image: linear-gradient(top, #b8b0af 0%, #f2ecea 100%);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
position: relative;
|
|
font-size: 1.8em;
|
|
font-family: 'Fira Code', monospace;
|
|
font-weight: 400;
|
|
text-align: center;
|
|
}
|
|
|
|
.text-info {
|
|
display: flex;
|
|
background-image: -moz-linear-gradient(top, #b8b0af 0%, #f2ecea 100%);
|
|
background-image: -webkit-linear-gradient(top, #b8b0af 0%, #f2ecea 100%);
|
|
background-image: -o-linear-gradient(top, #b8b0af 0%, #f2ecea 100%);
|
|
background-image: -ms-linear-gradient(top, #b8b0af 0%, #f2ecea 100%);
|
|
background-image: linear-gradient(top, #b8b0af 0%, #f2ecea 100%);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
position: relative;
|
|
font-size: 1.2em;
|
|
font-family: 'Fira Code', monospace;
|
|
font-weight: 200;
|
|
text-align: center;
|
|
max-width: 80%;
|
|
}
|
|
</style>
|
|
<script>
|
|
var countDownDate = new Date("Nov 5, 2023 18:00:00").getTime();
|
|
var x = setInterval(function() {
|
|
var now = new Date().getTime();
|
|
var distance = countDownDate - now;
|
|
var days = Math.floor(distance / (1000 * 60 * 60 * 24));
|
|
var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
|
|
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
|
|
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
|
|
document.getElementById("countdown").innerHTML = days + "d " + hours + "h " +
|
|
minutes + "m " + seconds + "s ";
|
|
if (distance < 0) {
|
|
clearInterval(x);
|
|
document.getElementById("countdown").innerHTML = "Timer finished, refresh the page";
|
|
}
|
|
}, 1000);
|
|
</script>
|
|
</body>
|
|
|
|
</html> |