basic-todo-list/index.html at master · Bernard-code/basic-todo-list · GitHub

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
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="stylesheet" href="css/style.css">
	<link href="https://fonts.googleapis.com/css?family=Ubuntu+Mono:400,700" rel="stylesheet">

</head>
<body>
	<div class="container">
		<h1 class="mainHead">Add Task</h1>
		<hr class="mainLine" />

		<div class="addHead">
			<input type="text" id="addTask" />

			<button id="addButton">
				<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-2 10h-4v4h-2v-4H7v-2h4V7h2v4h4v2z"/></svg>

			</button>

		</div>

		<div class="flex">
			<div class="flexBox">
				<h2 class="mainHead">To Do</h2>
				<hr class="mainLine" />
				<ul id="tasks"></ul>
			</div>

			<div class="flexBox">
				<h2 class="mainHead">Completed</h2>
				<hr class="mainLine" />
				<ul id="doneTasks"></ul>
			</div>
		</div>

	</div>

	<script src="app.js"></script>
</body>
</html>