Symptoms Page HTML file

mrudinipatel · May 18, 2021 · 3f7c012 · 3f7c012
1 parent 1cc25d7
commit 3f7c012
Showing 1 changed file with 78 additions and 0 deletions.
diff --git a/symptom.html b/symptom.html
@@ -0,0 +1,78 @@
+<!DOCTYPE html>
+<html lang="en-ca">
+<head>
+  <meta charset="UTF-8">
+  <link rel="stylesheet" href="symptom.css">
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/css/all.css">
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
+  <title>Covi-track Symptoms</title>
+</head>
+<body>
+  <h1>SYMPTOMS</h1>
+
+  <div class ="overlay">
+    <div class="navbar">
+        <div class="logo">
+          <div class="logo">
+            <a href="index.html">
+              <img src="logo1.png" alt="App Logo">
+            </a>
+          </div>
+        </div>
+
+        <nav>
+            <a href = "mental.html">Mental Health</a>
+            <a href = "vacc.html">Vaccinations</a>
+            <a href = "symptom.html">Symptoms Tracker</a>
+        </nav>
+    </div>
+
+  <div class="container">
+    <input type="text" class="input" placeholder="enter symptoms">
+    <div class="unassessed">
+      <h3>unassessed symptoms</h3>
+    </div>
+
+    <div class="assessed">
+      <h3>assessed symptoms</h3>
+    </div>
+
+    <div class="announc">
+      <h4>Please visit the <a href="vacc.html">vaccination page </a>to locate your nearest clinic to examine COVID-19 symptoms.</h4>
+      <p>Reminder to sanitize your hands and wear a fask mask in public.</p>
+    </div>
+  </div>
+
+  <script type="text/javascript">
+    $(".input").on("keyup",function(e){
+      if(e.keyCode == 13 && $(".input").val() != ""){  //13 is the enter button
+        var symptom = $("<div class='symptom'></div>").text($(".input").val());
+
+        var del = $("<i class='fas fa-trash-alt'></i>").click(function(){ //"fas fa-trash-alt" is the trash-bin icon in the href linked above
+          var p = $(this).parent();
+
+          p.fadeOut(function(){
+            p.remove();
+          });
+        });
+
+        var check = $("<i class='fas fa-check'></i>").click(function(){
+          var p = $(this).parent();
+
+          p.fadeOut(function(){
+            $(".assessed").append(p);
+            p.fadeIn();
+          });
+
+          $(this).remove();
+        });
+
+        symptom.append(del,check);
+        $(".unassessed").append(symptom);
+        $(".input").val("");
+      }
+    });
+  </script>
+
+</body>
+</html>