feat: add The American countdown
This commit is contained in:
parent
f16a72271e
commit
e5b9b81e57
|
@ -94,6 +94,12 @@
|
||||||
|
|
||||||
<div style="margin:50px 0;"></div>
|
<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">
|
<div class="container">
|
||||||
<main role="main" class="pb-3">
|
<main role="main" class="pb-3">
|
||||||
@RenderBody()
|
@RenderBody()
|
||||||
|
|
Binary file not shown.
After Width: | Height: | Size: 17 KiB |
|
@ -359,3 +359,17 @@ table.reading-list {
|
||||||
td.trim-p p:last-child {
|
td.trim-p p:last-child {
|
||||||
margin-bottom: 0;
|
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;
|
||||||
|
}
|
||||||
|
}
|
|
@ -97,4 +97,22 @@ declare const Prism: any;
|
||||||
}
|
}
|
||||||
|
|
||||||
UI.updateUI();
|
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);
|
||||||
})();
|
})();
|
||||||
|
|
Loading…
Reference in New Issue