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 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()
|
||||
|
BIN
src/img/us-flag-cover_512x166.png
Normal file
BIN
src/img/us-flag-cover_512x166.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 17 KiB |
@ -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;
|
||||
}
|
||||
}
|
@ -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);
|
||||
})();
|
||||
|
Loading…
Reference in New Issue
Block a user