forked from mdn/to-do-notifications
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
113 lines (97 loc) · 3.84 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
111
112
113
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=380">
<title>To do list with Notifications</title>
<!-- Icon originated from design by Sabine Wollender: http://thenounproject.com/wosamo/ -->
<link rel="icon" type="image/png" href="img/icon-128.png">
<link href='https://fonts.googleapis.com/css?family=Donegal+One|Lily+Script+One' rel='stylesheet' type='text/css'>
<link href="style/style.css" type="text/css" rel="stylesheet">
</head>
<body>
<h1>To do list</h1>
<div class="task-box">
<ul id="task-list">
</div>
</ul>
<div class="form-box">
<h2>Add new to do.</h2>
<form id="task-form" action="index.html">
<div class="full-width"><label for="title">Task title:</label><input type="text" id="title" required></div>
<div class="half-width"><label for="deadline-hours">Hours (hh):</label><input type="number" id="deadline-hours" required></div>
<div class="half-width"><label for="deadline-minutes">Mins (mm):</label><input type="number" id="deadline-minutes" required></div>
<div class="third-width"><label for="deadline-day">Day:</label>
<select id="deadline-day" required>
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select></div>
<div class="third-width"><label for="deadline-month">Month:</label>
<select id="deadline-month" required>
<option value="January">January</option>
<option value="February">February</option>
<option value="March">March</option>
<option value="April">April</option>
<option value="May">May</option>
<option value="June">June</option>
<option value="July">July</option>
<option value="August">August</option>
<option value="September">September</option>
<option value="October">October</option>
<option value="November">November</option>
<option value="December">December</option>
</select></div>
<div class="third-width"><label for="deadline-year">Year:</label>
<select id="deadline-year" required>
<option value="2025">2025</option>
<option value="2024">2024</option>
<option value="2023">2023</option>
<option value="2022">2022</option>
<option value="2021">2021</option>
<option value="2020">2020</option>
<option value="2019">2019</option>
<option value="2018">2018</option>
</select></div>
<div><input type="submit" id="submit" value="Add Task"></div>
<div></div>
</form>
</div>
<div id="toolbar">
<ul id="notifications">
</ul>
<button id="enable">
Enable notifications
</button>
</div>
</body>
<script src="scripts/todo.js"></script>
</html>