JSFiddle - React, Tailwind, and code Playground
HTML
<section class="cumcounter">
<i class="emoji">
🙀
</i>
<h1>
It's been <span id="days" class="days"></span> days since the last launch of bryan's 🚀
</h1>
</section>
CSS
body {
background-color: #56BB81;
color: #000;
font-family: 'Lato', Sans-serif;
padding: 50px;
}
.emoji {
font-size: 7rem;
font-style: normal;
}
.cumcounter {
background-color: #FFF;
border-radius: 10px;
padding: 20px;
text-align: center;
box-shadow: 0px 0px 10px rgba(0,0,0,.2)
}
Babel + JSX
const daysDiv = document.getElementById('days')
const montharray =new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")
const countup = (yr,m,d) => {
const today = new Date()
let todayy = today.getYear()
if (todayy < 1000)
todayy+=1900
const todaym=today.getMonth()
const todayd=today.getDate()
const todaystring=montharray[todaym]+" "+todayd+", "+todayy
const paststring=montharray[m-1]+" "+d+", "+yr
let difference=(Math.round((Date.parse(todaystring)-Date.parse(paststring))/(24*60*60*1000))*1)
daysDiv.innerHTML = difference
}
countup(2016,10,9)