-
Notifications
You must be signed in to change notification settings - Fork 0
/
TodoList.html
77 lines (69 loc) · 2.42 KB
/
TodoList.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta content="width=device-width" name="viewport"/>
<title>ToDoList</title>
<meta name="description" content="Omf's ToDoList">
<link rel="stylesheet" href="./css/app-header.css">
<link rel="stylesheet" href="./css/app-body.css">
<link rel="stylesheet" href="./css/app-footer.css">
<link rel="stylesheet" href="./css/edit-dialog.css">
<script src="model.js"></script>
<script src="provider-localStorage.js"></script>
<script src="TodoList.js"></script>
</head>
<body>
<div class="todo-app">
<header class="app-header">
<div id="float-wrapper">
<div id="title">
<h1>ToDoList</h1>
<p class="todo-count"></p>
</div>
<div id = "operation">
<input class="complete-all complete-all-unselected" type="checkbox">
<img class="op-input" src="./image/closed.svg" alt="closed button"/>
</div>
</div>
<div id = "todo-input-div">
<input class="add-todo-input" type="text" placeholder="Touch here to input your todo">
<input class="add-todo-date-input" id="date" type="datetime-local">
</div>
</header>
<section class="app-body">
<ul class="todo-list">
</ul>
</section>
<footer class="app-footer">
<ul class="filters-tab">
<li class="selected">All</li>
<li>Active</li>
<li>Completed</li>
</ul>
<div id = "clear-part">
<span id="clear-text">All</span>
<input id="clear-img" name="clear" type="image" src="./image/clear.svg" alt="clear" />
</div>
<img class="rank" src="./image/sort_wheat.svg" alt = "rank button"/>
<ul class="rank-dropup-wrapper" id="rank-dropup-wrapper">
<li class="rank-menu-item">Default</li>
<li class="rank-menu-item">By Star</li>
<li class="rank-menu-item">By DDL</li>
</ul>
</footer>
</div>
<div id="edit-todo-wrapper" class="hidden">
<div id="edit-todo-dialog">
<h2>MODIFY</h2>
<label for="edit-label-input">Modify todo label and time here:</label>
<input id="edit-label-input" type="text" autofocus>
<input id="edit-date-input" type="datetime-local">
<div id="edit-button-area">
<button id="ok-edit-button" type="button">Ok</button>
<button id="cancel-edit-button" type="button">Cancel</button>
</div>
</div>
</div>
</body>
</html>