-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
56 lines (46 loc) · 2.06 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
<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">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<title>JS Name DateSorter</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Oswald:wght@500&family=Poppins&display=swap" rel="stylesheet">
<link href="css/global.css" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="item">
<div class="innerContainer">
<h1>JS Name DateSorter</h1>
<p>A handy little date sorter which calculates the age of the person upon entering their date of birth.
All data is saved in the browsers local storage.
The calculate age button refreshes the age stored in the local storage.
</p>
</div>
<div class="innerContainer">
<form id="userData" method="POST">
<label for="name">Name</label>
<input type="text" name="name" id="name">
<label for="birth_date">DOB</label>
<input type="date" name="birth_date" id="birth_date">
<button id="submit" type="submit">Add</button>
</form>
</div>
<div class="innerContainer">
<div id="info"></div>
<button id="checkAge">Recalculate Age</button>
<button id="clearTable">Clear Table</button>
</div>
</div>
<div id="tableContainer" class="item">
</div>
</div>
<script src="js/global.js"></script>
</body>
</html>