feat: add The American countdown

This commit is contained in:
Oliver Booth 2024-02-19 22:44:28 +00:00
parent f16a72271e
commit e5b9b81e57
Signed by: oliverbooth
GPG Key ID: E60B570D1B7557B5
4 changed files with 39 additions and 1 deletions

View File

@ -94,6 +94,12 @@
<div style="margin:50px 0;"></div>
<div id="usa-countdown" class="container">
<p>00 : 00 : 00 : 00</p>
</div>
<div style="margin:50px 0;"></div>
<div class="container">
<main role="main" class="pb-3">
@RenderBody()

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

View File

@ -188,7 +188,7 @@ article {
img {
transform: scale(110%);
}
p.project-title {
font-size: 1.2em;
margin: calc(-35px - .2em) 0 0;
@ -358,4 +358,18 @@ table.reading-list {
td.trim-p p:last-child {
margin-bottom: 0;
}
#usa-countdown {
background-image: url('/img/us-flag-cover_512x166.png');
background-position: center;
background-repeat: no-repeat;
background-size: cover;
p {
text-align: center;
font-size: 3em;
margin: 0;
padding: 0;
}
}

View File

@ -97,4 +97,22 @@ declare const Prism: any;
}
UI.updateUI();
setInterval(() => {
const countdown = document.querySelector("#usa-countdown p");
const start = new Date().getTime();
const end = Date.UTC(2024, 2, 7, 13, 20);
const diff = end - start;
let days = Math.floor(diff / (1000 * 60 * 60 * 24));
let hours = Math.floor((diff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
let minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60));
let seconds = Math.floor((diff % (1000 * 60)) / 1000);
if (days < 0) days = 0
if (hours < 0) hours = 0;
if (minutes < 0) minutes = 0;
if (seconds < 0) seconds = 0;
countdown.innerHTML = `${days.toString().padStart(2, '0')} : ${hours.toString().padStart(2, '0')} : ${minutes.toString().padStart(2, '0')} : ${seconds.toString().padStart(2, '0')}`;
}, 1000);
})();