Your IP : 216.73.217.62
<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="utf-8">
<title>time left</title>
<style>
* {
margiN: 0;
padding: 0
}
.width {
width: 90%;
margin: 50px auto;
text-align: center
}
li {
display: flex;
align-items: center;
justify-content: space-between;
background: #bfcddc;
padding: 5px 10px;
margin: 5px 0;
border: 1px solid #2b5888;
}
ol {
display: table;
margin: 0 auto 50px;
}
li h3 {
padding: 0 15px 0 0;
min-width: 200px;
border-right: 1px solid #2b5888;
margin: 0 15px 0 0;
}
</style>
</head>
<body>
<div class="width">
<h1>22 MAJA 2018 o 17:00</h1>
<div id="countdown"></div>
<div id="counts"></div>
</div>
<ol>
<li>
<h3>NPM </h3>
<p><span>2</span> dni</p>
</li>
<li>
<h3>Node.js </h3>
<p><span>5</span> dni</p>
</li>
<li>
<h3>Gulp </h3>
<p><span>3</span> dni</p>
</li>
<li>
<h3>Git </h3>
<p><span>5</span> dni</p>
</li>
<li>
<h3>Bootstrap, I </h3>
<p><span>3</span> dni</p>
</li>
<li>
<h3>Bootstrap II </h3>
<p><span>3</span> dni</p>
</li>
<li>
<h3>Bootstrap III </h3>
<p><span>3</span> dni</p>
</li>
<li>
<h3>GridBox, I </h3>
<p><span>2</span> dni</p>
</li>
<li>
<h3>GridBox, II </h3>
<p><span>2</span> dni</p>
</li>
<li>
<h3>GridBox, III </h3>
<p><span>2</span> dni</p>
</li>
<li>
<h3>Wordpress, I </h3>
<p><span>5</span> dni</p>
</li>
<li>
<h3>Wordpress, II </h3>
<p><span>5</span> dni</p>
</li>
<li>
<h3>Wordpress, III </h3>
<p><span>5</span> dni</p>
</li>
<li>
<h3>SASS, I </h3>
<p><span>2</span> dni</p>
</li>
<li>
<h3>SASS, II </h3>
<p><span>2</span> dni</p>
</li>
<li>
<h3>SASS, III </h3>
<p><span>2</span> dni</p>
</li>
<li>
<h3>MINDMAPA </h3>
<p><span>5</span> dni</p>
</li>
<li>
<h3>Babel </h3>
<p><span>2</span> dni</p>
</li>
<li>
<h3>Browserify. </h3>
<p><span>1</span> dni</p>
</li>
<li>
<h3>Webpack </h3>
<p><span>1</span> dni</p>
</li>
<li>
<h3>Mustache.js </h3>
<p><span>3</span> dni</p>
</li>
<li>
<h3>Handlebars.js </h3>
<p><span>3</span> dni</p>
</li>
<li>
<h3>TypeScript </h3>
<p><span>3</span> dni</p>
</li>
<li>
<h3>Materialize, I </h3>
<p><span>5</span> dni</p>
</li>
<li>
<h3>Materialize, II </h3>
<p><span>5</span> dni</p>
</li>
<li>
<h3>Materialize, III </h3>
<p><span>5</span> dni</p>
</li>
</ol>
<script>
window.addEventListener('DOMContentLoaded', function() {
var end = new Date('05/22/2018 05:00 PM');
var _second = 1000;
var _minute = _second * 60;
var _hour = _minute * 60;
var _day = _hour * 24;
var timer;
var now = new Date();
var distance = end - now;
if (distance < 0) {
document.getElementById('countdown').innerHTML = 'To juz dziś!';
} else {
var days = Math.floor(distance / _day);
document.getElementById('countdown').innerHTML = 'czyli za ' + days + ' dni ;)';
}
var counts = document.querySelectorAll('li span');
var count = 0
for (var i = 0; i < counts.length; i++) {
count += Number(counts[i].innerHTML);
}
document.getElementById('counts').innerHTML = 'praca rozplanowana na ' + count + ' dni';
});
</script>
</body>
</html>