JSFiddle - React, Tailwind, and code Playground
HTML
<body>
<div><input type="text" class="time"/></div>
</body>
CSS
@import url('https://fonts.googleapis.com/css?family=Press+Start+2P');
.time {
font-size:10vw;
font-family: 'Press Start 2P', cursive;
}
JavaScript
function startTimer(duration) {
var timer = duration*60,hours, minutes;
setInterval(function () {
hours = parseInt((timer / 3600)%24, 10)
minutes = parseInt((timer / 60)%60, 10);
hours = hours < 10 ? "0" + hours : hours;
minutes = minutes < 10 ? "0" + minutes : minutes;
$('input[type=text].time').val(hours + ":" + minutes);
if (++timer < 0) {
timer = 0;
}
}, 1);
}
jQuery(function ($) {
var minutes = 1436;
startTimer(minutes);
});