<!DOCTYPE HTML>
<html>
<head>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-167417611-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-167417611-1');
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<meta name="description" content="Site de présentation d'Adrien CHARBONNEAU - Naturaliste écologue et ornithologue passionné.">
<meta name="author" content="Adrien CHARBONNEAU">
<meta property="og:title" content="Adrien CHARBONNEAU – Naturaliste écologue" />
<meta property="og:image" content="https://adriencharbonneau.fr/images/avatar.jpg" />
<meta property="og:url" content="https://adriencharbonneau.fr" />
<meta property="og:description" content="Site de présentation d'Adrien CHARBONNEAU - Naturaliste écologue et ornithologue passionné." />
<meta property="og:nom_du_site" content="Adrien CHARBONNEAU – Naturaliste écologue"/>
<link rel="icon" type="image/png" href="images/AC_favicon.png" />
<TITLE>LANCEMENT DU SITE</TITLE>
<style>
/* general styling */
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
html, body {
height: 100%;
margin: 0;
}
body {
align-items: center;
background-color: #ffd54f;
display: flex;
font-family: -apple-system,
BlinkMacSystemFont,
"Segoe UI",
Roboto,
Oxygen-Sans,
Ubuntu,
Cantarell,
"Helvetica Neue",
sans-serif;
}
.container {
color: #333;
margin: 0 auto;
text-align: center;
}
h1 {
font-weight: normal;
letter-spacing: .125rem;
text-transform: uppercase;
}
li {
display: inline-block;
font-size: 1.5em;
list-style-type: none;
padding: 1em;
text-transform: uppercase;
}
li span {
display: block;
font-size: 4.5rem;
}
.message {
font-size: 4rem;
display: none;
padding: 1rem;
}
.emoji {
padding: 0 .25rem;
}
@media all and (max-width: 768px) {
h1 {
font-size: 1.5rem;
}
li {
font-size: 1.125rem;
padding: .75rem;
}
li span {
font-size: 3.375rem;
}
}
</style>
</head>
<body>
<div class="container">
<h1 id="headline">Lancement du nouveau site internet 🚀 :</h1>
<div id="countdown">
<ul>
<li><span id="days"></span>Jours</li>
<li><span id="hours"></span>Heures</li>
<li><span id="minutes"></span>Minutes</li>
<li><span id="seconds"></span>Secondes</li>
</ul>
</div>
</div>
<script>
document.head.appendChild(Object.assign(document.createElement("link"), {rel: "icon", href: "data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>🚀</text></svg>"}))
(function () {
const second = 1000,
minute = second * 60,
hour = minute * 60,
day = hour * 24;
let launch = "May 2, 2021 00:00:00",
countDown = new Date(launch).getTime(),
x = setInterval(function() {
let now = new Date().getTime(),
distance = countDown - now;
document.getElementById("days").innerText = Math.floor(distance / (day)),
document.getElementById("hours").innerText = Math.floor((distance % (day)) / (hour)),
document.getElementById("minutes").innerText = Math.floor((distance % (hour)) / (minute)),
document.getElementById("seconds").innerText = Math.floor((distance % (minute)) / second);
//do something later when date is reached
if (distance < 0) {
let headline = document.getElementById("headline"),
countdown = document.getElementById("countdown"),
content = document.getElementById("content");
headline.innerText = "Le nouveau site est lancé 🚀 ! Il suffit de recharger la page...";
countdown.style.display = "none";
content.style.display = "block";
clearInterval(x);
}
//seconds
}, 0)
}());
</script>
</body>
</html>