-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
56 lines (50 loc) · 2.44 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>TODO</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark py-0 order-lg-0 fixed-top">
<div class="container px-4">
<h2
class="text-uppercase px-5 navbarbtn mx-auto text-center text-white d-flex justify-content-center align-items-center">
TaskMaster</h2>
</div>
</div>
</nav>
<div class="paraSection container">
<p class="text-center text-dark">This tool empowers users to not only record what needs to be done, but also to
prioritize tasks, allocate time wisely, and allocate focus where it's most needed. Crossing off completed
items generates a gratifying sense of accomplishment, encouraging continued momentum. Additionally, a to-do
list liberates mental space by externalizing thoughts, reducing the burden of remembering tasks.</p>
</div>
<section class="cardList">
<div class="container">
<form id="todo-form">
<div class="mb-3">
<label for="title" class="form-label">Title:</label>
<input type="text" class="form-control" id="title" required>
</div>
<div class="mb-3">
<label for="description" class="form-label">Description:</label>
<textarea class="form-control" id="description" required></textarea>
</div>
<button class="btn btn-primary" type="submit">Add Task</button>
</form>
</div>
</section>
<ul class="list mx-auto text-center pb-4" id="task-list"></ul>
<footer class="custom-footer mt-4 navbar-dark bg-dark">
<p>© 2023 ONE. All rights reserved by HH</p>
</footer>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"
integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p"
crossorigin="anonymous"></script>
<script src="script.js"></script>
</body>
</html>