diff --git a/Lab01/app/templates/tasks.tmpl b/Lab01/app/templates/tasks.tmpl
index c432522..66c249c 100644
--- a/Lab01/app/templates/tasks.tmpl
+++ b/Lab01/app/templates/tasks.tmpl
@@ -12,6 +12,21 @@
     <div class="fs-3 text-center mt-5">{{ .title }}</div>
     <hr>
     <div id="tasks"></div>
+    <hr>
+    <form class="row g-3 needs-validation" novalidate>
+        <div class="col-1"></div>
+        <div class="col-8">
+            <div class="input-group has-validation">
+                <input type="text" class="form-control" id="description" required>
+                <div class="invalid-feedback">
+                    Please provide a description.
+                </div>
+            </div>
+        </div>
+        <div class="col-3">
+            <button class="btn btn-primary" id="button" type="submit"><i class="bi bi-plus-lg"></i></button>
+        </div>
+    </form>
 </div>
 
 {{template "scripts" .}}
@@ -24,9 +39,10 @@
             const taskHeader = document.createElement("div");
             taskHeader.classList.add('row', 'g-0', 'align-items-center', 'mb-1');
             taskHeader.innerHTML = `
-                <div class="col-2 overflow-ellipsis text-end pe-4">ID</div>
-                <div class="col-6 overflow-ellipsis">Description</div>
-                <div class="col-2 overflow-ellipsis text-end">Done</div>
+                <div class="fw-bold col-1 text-center">ID</div>
+                <div class="fw-bold col-8">Description</div>
+                <div class="fw-bold col-2 text-center">Done</div>
+                <div class="fw-bold col-1 text-center">Delete</div>
                 <hr class="mt-3 mb-2">
             `;
             tasksEl.appendChild(taskHeader);
@@ -36,9 +52,12 @@
                     const newTask = document.createElement('div');
                     newTask.classList.add('row', 'g-0', 'align-items-center', 'mb-1');
                     newTask.innerHTML = `
-                        <div class="col-2 overflow-ellipsis text-end pe-4">${task.ID}</div>
-                        <div class="col-6 overflow-ellipsis">${task.Description}</div>
-                        <div class="col-2 overflow-ellipsis text-end"><i class="bi ${task.Done ? "bi-check-circle" : "bi-circle"}"></i></div>
+                        <div class="col-1 text-center">${task.ID}</div>
+                        <div class="col-8">${task.Description}</div>
+                        <div class="col-2 form-check form-switch d-flex justify-content-center">
+                          <input class="text-center form-check-input" type="checkbox" ${task.Done && "checked"} role="switch" id="flexSwitchCheckDefault">
+                        </div>
+                        <button class="col-1 btn btn-danger"><i class="bi bi-trash"></i></button>
                     `;
                     tasksEl.appendChild(newTask);
                 });