-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
110 lines (75 loc) · 3.75 KB
/
index.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
106
107
108
109
110
<!DOCTYPE html>
<html>
<head>
<title>ResQR</title>
<link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/images/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/images/favicon-16x16.png">
<link rel="manifest" href="/images/site.webmanifest">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://cdn.rawgit.com/davidshimjs/qrcodejs/gh-pages/qrcode.min.js"></script>
<link rel="stylesheet" href="EQRStyle.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div class="container">
<div class="icon">
<img src="/images/crescent.png" alt="icon" width="150" height="150">
<p>ResQR</p>
</div>
<div>
<h1 style="text-align: center;" class="mt-5"></h1>
</div>
<div class="instructions-container mt-4">
<div>
<h2>What is ResQR</h2>
</div>
<p>ResQR is a system designed to provide crucial medical information to paramedics and first responders in emergencies. By inputting your details into ResQR, you can generate a unique QR code that can be easily scanned by medical professionals. This enables them to quickly access your medical history, allergies, and other vital information that can significantly impact your treatment. ResQR aims to bridge the gap between patients and paramedics, ensuring faster and more informed care during critical situations.</p>
</div>
<form>
<div class="mb-3">
<label for="name" class="form-label">Name:</label>
<input type="text" class="form-control" id="name" placeholder="Full legal name">
</div>
<div class="mb-3">
<label for="age" class="form-label">Year of Birth:</label>
<input type="text" class="form-control" id="age" placeholder="Just the year">
</div>
<div class="mb-3">
<label for="bloodType" class="form-label">Blood Type:</label>
<input type="text" class="form-control" id="bloodType" placeholder="Leave Blank if unknown">
</div>
<div class="mb-3">
<label for="allergies" class="form-label">Allergies:</label>
<input type="text" class="form-control" id="allergies" placeholder="Leave blank if none">
</div>
<div class="mb-3">
<label for="medConditions" class="form-label">Medical Conditions:</label>
<input type="text" class="form-control" id="medConditions" placeholder="Leave blank if none">
</div>
<div class="mb-3">
<label for="emergencyContact1" class="form-label">Emergency Contact:</label>
<input type="text" class="form-control" id="emergencyContact1" placeholder="Someone trusted">
</div>
<div style="text-align: center; vertical-align: middle;"><button type="button" class="btn btn-primary"
onclick="generateQRCode()">Generate QR Code</button></div>
</form>
<div class="text-center mt-4">
<div id="qrcode-container">
<div id="qrcode"></div>
<div style="text-align: center; vertical-align: middle;">
<a id="viewprofile"
class="btn btn-primary" href="">View Profile</a>
</div>
</div>
<footer class="footer mt-5">
<div class="container">
© Abdul Baari Davids 2023 |
<a href="https://abduldavids.github.io/">Website</a> |
<a href="https://github.com/AbdulDavids">GitHub</a>
</div>
</footer>
<script src="EQRScript.js"></script>
</body>
</html>