generated from kiei451-winter2021/final
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Vaccines.html
105 lines (86 loc) · 5.09 KB
/
Vaccines.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HealthPassport - Vaccines</title>
<link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet" type="text/css">
<link type="text/css" rel="stylesheet" href="https://www.gstatic.com/firebasejs/ui/4.7.3/firebase-ui-auth.css" />
</head>
<body>
<div class="sign-in-or-sign-out"></div>
<!-- NAVIGATION -->
<div title="navigation" class="px-2 md:px-10 py-4 text-blue-600 border border-gray-300">
<div class="flex">
<p class="md:w-full w-1/5 md:w-1/8 text-center md:text-left"><a href="index.html">Home</a></p>
<p class="md:w-full w-1/5 md:w-1/8 text-center md:text-left"><a href="Vaccines.html">Vaccines</a></p>
<p class="md:w-full w-1/5 md:w-1/8 text-center md:text-left"><a href="Family.html">Family</a></p>
<p class="md:w-full w-1/5 md:w-1/8 text-center md:text-left"><a href="mailto:[email protected]">Help</a></p>
<div class="md:w-full w-0 md:w-1/8"></div>
<div class="md:w-full w-0 md:w-1/8"></div>
<div class="md:w-full w-0 md:w-1/8"></div>
<!-- I had to take Alex Navarro | out to make it all fit.
Probably a nice to have to have the name and if so we have to
figure out how responsive design makes it only appear when on a full size screen. -->
<p class="md:w-full w-1/5 md:w-1/8 text-center md:text-right" id="sign-in-or-sign-out"><a href="index.html">Log
Out</a></p>
</div>
</div>
<!-- HEADER -->
<div class="text-3xl md:text-5xl p-10 text-grey-darker">Vaccine History</div>
<!-- Vaccine Card -->
<div class="text-lg md:text-2xl px-10 text-grey-darker">Latest Vaccines</div>
<div class="container-vaccineCards">
<!-- Javascript fills data here -->
</div>
<!-- Form -->
<div>
<form class="px-4 py-2 max-w-xs rounded-xl border shadow-lg my-4 mx-10">
<input type="text" id="shotName" name="shotName" placeholder="Shot Name"
class="my-2 p-2 w-72 border border-gray-300 rounded shadow-xl focus:outline-none focus:ring-purple-500 focus:border-purple-500">
<input type="text" id="dateInitial" name="dateInitial" placeholder="Date of Initial Shot"
class="my-2 p-2 w-72 border border-gray-300 rounded shadow-xl focus:outline-none focus:ring-purple-500 focus:border-purple-500">
<input type="text" id="dateBooster1" name="dateBooster1" placeholder="Date of Booster Shot 1"
class="my-2 p-2 w-72 border border-gray-300 rounded shadow-xl focus:outline-none focus:ring-purple-500 focus:border-purple-500">
<input type="text" id="dateBooster2" name="dateBooster2" placeholder="Date of Booster Shot 2"
class="my-2 p-2 w-72 border border-gray-300 rounded shadow-xl focus:outline-none focus:ring-purple-500 focus:border-purple-500">
<button class="button bg-blue-600 hover:bg-blue-600 text-white mt-2 px-4 py-2 rounded-xl">Submit</button>
</form>
</div>
<!-- <div>
<form class=" px-10 w-full mt-8">
<input type="text" id="shotName" name="shotName" placeholder="Shot Name"
class="my-2 p-2 w-64 border border-gray-400 rounded shadow-xl focus:outline-none focus:ring-purple-500 focus:border-purple-500">
<input type="text" id="dateInitial" name="dateInitial" placeholder="Date of Initial Shot"
class="my-2 p-2 w-64 border border-gray-400 rounded shadow-xl focus:outline-none focus:ring-purple-500 focus:border-purple-500">
<input type="text" id="dateBooster1" name="dateBooster1" placeholder="Date of Booster Shot 1"
class="my-2 p-2 w-64 border border-gray-400 rounded shadow-xl focus:outline-none focus:ring-purple-500 focus:border-purple-500">
<input type="text" id="dateBooster2" name="dateBooster2" placeholder="Date of Booster Shot 2"
class="my-2 p-2 w-64 border border-gray-400 rounded shadow-xl focus:outline-none focus:ring-purple-500 focus:border-purple-500">
<button class="button bg-green-500 hover:bg-green-600 text-white px-4 py-2 rounded-xl">Submit</button>
</form>
</div> -->
<!-- ---------------- FIREBASE BELOW --------------- -->
<!-- Put the Firebase config here -->
<!-- The core Firebase JS SDK is always required and must be listed first -->
<script src="https://www.gstatic.com/firebasejs/8.2.7/firebase-app.js"></script>
<!-- Firebase Auth -->
<script src="https://www.gstatic.com/firebasejs/8.2.7/firebase-firestore.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.2.7/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/ui/4.7.3/firebase-ui-auth.js"></script>
<script>
// Your web app's Firebase configuration
var firebaseConfig = {
apiKey: "AIzaSyB2ghQCvl9Bps-uv_7ToQTiwqzcYwiSsr0",
authDomain: "kiei-451-4d1c2.firebaseapp.com",
projectId: "kiei-451-4d1c2",
storageBucket: "kiei-451-4d1c2.appspot.com",
messagingSenderId: "1064307467074",
appId: "1:1064307467074:web:88407534ef9360dde81edb"
}
// Initialize Firebase
firebase.initializeApp(firebaseConfig);
</script>
<script src="vaccines.js"></script>
</body>
</html>