Merge pull request #18 from KryptonANSHU/CountDown_App

Count down app

Author: gantavyamalviya

New Year CountDown App/Images/bg1.jpg

@@ -0,0 +1,3 @@
+This is a basic Web App that tells how uch time is left for the NEW YEAR :)
+
+![image](https://user-images.githubusercontent.com/72062616/193441853-619f9e43-8b74-4e3a-9bf1-0814b3ea9f5a.png)

New Year CountDown App/Readme.md

@@ -0,0 +1,48 @@
+@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;1,200&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@1,500&display=swap');
+
+
+
+
+*{
+    box-sizing: border-box;
+}
+
+body{
+    margin: 0px;
+    background: url('Images/bg1.jpg') no-repeat;
+    background-size: cover; 
+    /* background-position: center center;  */
+    min-height: 100vh;
+    font-family: 'Poppins', sans-serif;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    
+}
+h1{
+
+    font-size: 4.2rem;
+    font-weight: 400;
+    margin-top: 5rem;
+}
+
+.whole-elem{
+    text-align: center;
+}
+
+.con{
+    display: flex;
+    /* border: 5px solid #ffffff9c; 
+    padding: 15px 70px  ; */
+}
+
+.big-text{
+    text-align: center;
+    font-size: 6rem;    
+    margin: 0px 60px;
+}
+
+.whole-elem span{
+    font-size: 1.7rem;
+}

New Year CountDown App/index.html

@@ -0,0 +1,36 @@
+let daysEl = document.getElementById('days');
+let hourEl = document.getElementById('hours');
+let minEl = document.getElementById('mins');
+let secEl = document.getElementById('sec');
+
+
+function countdown(){
+
+var currentTime= new Date().getTime();    // Curent Time
+const newYear = new Date("dec 31, 2022 23:59:59").getTime();    // destination time
+
+var difference = newYear - currentTime;
+// you have got the answere but in milliseconds
+
+var seconds,hours,days,minutes;
+seconds = Math.floor((difference%(1000*60)/1000));
+minutes = Math.floor(difference%(1000*60*60)/(1000*60));
+hours = Math.floor((difference%(1000*60*60*24))/(1000*60*60));
+days = Math.floor(difference/(1000*60*60*24));
+
+daysEl.innerHTML = days;
+ hourEl.innerHTML =Timeformat(hours);
+minEl.innerHTML = Timeformat(minutes);
+secEl.innerHTML = Timeformat(seconds);
+
+};
+
+function Timeformat (time) {
+    if(time < 10)
+    return (`0${time}`);
+    else
+     return time;
+}
+
+setInterval(countdown,1000)       //Updtaes the function every 1 sec 
+// 1000ms = 1 sec 

New Year CountDown App/script.js

@@ -0,0 +1,48 @@
+@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;1,200&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@1,500&display=swap');
+
+
+
+
+*{
+    box-sizing: border-box;
+}
+
+body{
+    margin: 0px;
+    background: url('Images/bg1.jpg') no-repeat;
+    background-size: cover; 
+    /* background-position: center center;  */
+    min-height: 100vh;
+    font-family: 'Poppins', sans-serif;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    
+}
+h1{
+
+    font-size: 4.2rem;
+    font-weight: 400;
+    margin-top: 5rem;
+}
+
+.whole-elem{
+    text-align: center;
+}
+
+.con{
+    display: flex;
+    /* border: 5px solid #ffffff9c; 
+    padding: 15px 70px  ; */
+}
+
+.big-text{
+    text-align: center;
+    font-size: 6rem;    
+    margin: 0px 60px;
+}
+
+.whole-elem span{
+    font-size: 1.7rem;
+}