Fix Issue #5

Tanushree713 · Tanushree713 · commit 0d0fbcc94ff5 · 2023-10-03T15:24:53.000+05:30
diff --git a/CountDownTimer/Tanushree713/bcgImage.jpeg b/CountDownTimer/Tanushree713/bcgImage.jpeg
diff --git a/CountDownTimer/Tanushree713/index.html b/CountDownTimer/Tanushree713/index.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Sis-BirthDay</title>
+    <link rel="stylesheet" href="./style.css">
+</head>
+<body>
+    <div class="container">
+    <h1>2023</h1>
+    <h2 id="heading2">Yashi's Birthday CountDown</h2>
+    <img src="./WhatsApp Image 2023-03-16 at 23.24.23.jpeg" alt="Siso" title="Younger-SIS">
+    <div class="countdownBox">
+        <div class="Box1">
+            <p id="days">0</p>
+            <h3>Days</h3>
+        </div>
+        <div class="Box1">
+            <p id="hours">0</p>
+            <h3>Hours</h3>
+        </div>
+        <div class="Box1">
+            <p id="minutes">0</p>
+            <h3>Minutes</h3>
+        </div>
+        <div class="Box1">
+            <p id="seconds">0</p>
+            <h3>Seconds</h3>
+        </div>
+    </div>
+</div>
+    <script src="./server.js"></script>
+</body>
+</html>
diff --git a/CountDownTimer/Tanushree713/server.js b/CountDownTimer/Tanushree713/server.js
@@ -0,0 +1,29 @@
+ let days = document.getElementById("days");
+ let hours = document.getElementById("hours");
+ let minutes = document.getElementById("minutes");
+ let seconds = document.getElementById("seconds");
+
+function countdown(){
+let futureDate = new Date(" 12 November 2023 ");
+let currentDate= new Date();
+let remainingDate= futureDate-currentDate;
+
+let showDays= Math.floor(remainingDate / 1000 / 60 / 60 / 24);
+let showHours= Math.floor(remainingDate  / 1000 / 60 / 60) % 24;
+let showMinutes= Math.floor(remainingDate / 1000 / 60) % 60;
+let showSeconds= Math.floor(remainingDate / 1000) % 60;
+
+if ((showDays==0)&&(showHours==0)&&(showMinutes==0)&&(showSeconds==0)){
+    document.getElementById("heading2").innerHTML="!! HAPPIEST BIRTHDAY YASHI !!";
+    document.getElementById("heading2").style.color= "#A1045A";
+    clearInterval(clock);
+}
+else{
+days.innerHTML=showDays;
+hours.innerHTML=showHours;
+minutes.innerHTML=showMinutes;
+seconds.innerHTML=showSeconds;
+}
+}
+
+let clock=setInterval(countdown,1000);
diff --git a/CountDownTimer/Tanushree713/style.css b/CountDownTimer/Tanushree713/style.css
@@ -0,0 +1,78 @@
+*{
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+body{
+    background-image: linear-gradient(rgba(0, 0, 0, 0.504),rgba(0, 0, 0, 0.526) ), url(./bcgImage.jpeg); 
+    background-size: 100% 100%;
+    background-repeat: no-repeat;
+    height: 95.8vh;
+    color: #ffffff;
+    font-family: sans-serif;
+
+}
+.container{  
+
+    margin-top: 2%;
+}
+img[alt="Siso"]{
+      
+    border-radius: 30%;
+    height: 250px;
+    width: 230px;
+    margin-left: 44%;
+    margin-top: 30px;
+    border: 40px solid rgba(12, 12, 12, 0.911);
+
+}
+h1{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin-top: 2%;
+    font-size: 38px;
+    font-weight: 800;
+   word-spacing: 10px;
+
+}
+h2{  
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin-top: 1.3%;
+    margin-left: 60px;
+    font-size: 38px;
+    font-weight: 800;
+   word-spacing: 10px;
+}
+h3{
+    padding-left: 24px ;
+    padding-top: 12px;
+   
+}
+p{
+    font-size: 38px;
+    padding-left: 40px;
+}
+.countdownBox{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin-top: 3%;
+    margin-left: 5%;
+    font-weight: 500;
+    font-size: 16px;
+    
+}
+.Box1{
+    background-color: rgba(0, 0, 0, 0.593);
+    height: 100px;
+    width: 140px ;
+    margin-right:30px;
+    border-radius: 16px;
+    border: 2px solid rgba(247, 243, 243, 0.886);
+    padding-top: 30px;
+    padding-left: 10px;
+    line-height: 30px;
+}
