export fixed

4 files changed, 27 insertions, 41 deletions

diff --git a/app/check.js b/app/check.js
index 528471f..658fefa 100644
--- a/app/check.js
+++ b/app/check.js
@@ -2,33 +2,26 @@ import { jsList } from "./list.js";
 
 export function checkboxButton(id) {
     const checkboxElement = document.createElement('i');
-
-    checkboxElement.classList.add('fa-regular');
-    checkboxElement.classList.add('fa-square');
-    
+    checkboxElement.classList.add('fa-regular', 'fa-square');
     checkboxElement.setAttribute('title', 'Mark as done');
 
     checkboxElement.addEventListener('click', (click) => {
-        checkElement(click.target, id);
+        toggleCheck(click.target, id);
     });
 
     return checkboxElement;
 }
 
-function checkElement(element, id) {
+export function toggleCheck(element, id) {
     if (element.classList.contains('fa-square')) {
-        element.classList.remove('fa-square');
-        element.classList.add('fa-square-check');
-        element.parentNode.style.textDecoration = 'line-through';
-        element.parentNode.style.opacity = '0.6';
+        element.classList.replace('fa-square', 'fa-square-check');
+        element.parentNode.classList.toggle('checked');
         id = jsList.findIndex(el => el.id == id)
         jsList[id].done = true;
         localStorage.setItem('jsList', JSON.stringify(jsList));
     } else {
-        element.classList.add('fa-square');
-        element.classList.remove('fa-square-check');
-        element.parentNode.style.textDecoration = '';
-        element.parentNode.style.opacity = '';
+        element.classList.replace('fa-square-check', 'fa-square');
+        element.parentNode.classList.toggle('checked');
         id = jsList.findIndex(el => el.id == id)
         jsList[id].done = false;
         localStorage.setItem('jsList', JSON.stringify(jsList));
diff --git a/app/delete.js b/app/delete.js
index 1f7de72..df4feb7 100644
--- a/app/delete.js
+++ b/app/delete.js
@@ -2,11 +2,7 @@ import { jsList } from "./list.js";
 
 export function deleteButton(id) {
     const deleteButtonElement = document.createElement('i');
-
-    deleteButtonElement.classList.add('delete');
-    deleteButtonElement.classList.add('fa-solid');
-    deleteButtonElement.classList.add('fa-trash');
-    
+    deleteButtonElement.classList.add('delete', 'fa-solid', 'fa-trash');
     deleteButtonElement.setAttribute('title', 'Delete');
 
     deleteButtonElement.addEventListener('click', (clicked) => {
diff --git a/app/edit.js b/app/edit.js
index e2f5e34..791f43e 100644
--- a/app/edit.js
+++ b/app/edit.js
@@ -2,10 +2,7 @@ import { jsList } from "./list.js";
 
 export function editButton(id) {
     const buttonElement = document.createElement('i');
-    buttonElement.classList.add('edit');
-
-    buttonElement.classList.add('fa-solid');
-    buttonElement.classList.add('fa-pen-to-square');
+    buttonElement.classList.add('edit', 'fa-solid', 'fa-pen-to-square');
     buttonElement.setAttribute('title', 'Edit');
 
     buttonElement.addEventListener('click', (clicked) => {
@@ -16,28 +13,28 @@ export function editButton(id) {
 }
 
 function editElement(element, id) {
-    const forms = document.createElement('form');
-    const put = document.createElement('input');
+    const form = document.createElement('form');
+    const input = document.createElement('input');
 
-    put.style.fontSize = '0.9em';
-    put.focus();
-    put.value = element.childNodes[0].textContent;
+    input.style.fontSize = '0.9em';
+    input.focus();
+    input.value = element.childNodes[0].textContent;
     
-    forms.appendChild(put);
+    form.appendChild(input);
 
     hide(element);
 
-    forms.addEventListener('submit', (e) => {
+    form.addEventListener('submit', (e) => {
         e.preventDefault();
-        unhide(element, put, forms, id);
+        unhide(element, input, form, id);
     }, true);
 
-    forms.addEventListener('focusout', (e) => {
+    form.addEventListener('focusout', (e) => {
         e.preventDefault();
-        unhide(element, put, forms, id);
+        unhide(element, input, form, id);
     }, true);
 
-    element.appendChild(forms);
+    element.appendChild(form);
 }
 
 function hide(element) {
@@ -47,16 +44,16 @@ function hide(element) {
     element.childNodes[3].style.display = 'none';
 }
 
-function unhide(element, put, forms, id) {
-    element.childNodes[0].textContent = put.value;
+function unhide(element, input, form, id) {
+    element.childNodes[0].textContent = input.value;
     element.childNodes[1].style.display = '';
     element.childNodes[2].style.display = '';
     element.childNodes[3].style.display = '';
 
-    put.remove();
-    forms.remove();
+    input.remove();
+    form.remove();
 
     id = jsList.findIndex(el => el.id == id);
-    jsList[id].name = put.value;
+    jsList[id].name = input.value;
     localStorage.setItem('jsList', JSON.stringify(jsList));
 }
\ No newline at end of file
diff --git a/app/list.js b/app/list.js
index aea8949..2469dad 100644
--- a/app/list.js
+++ b/app/list.js
@@ -1,6 +1,6 @@
 import { deleteButton } from "./delete.js";
 import { editButton } from "./edit.js";
-import { checkboxButton } from "./check.js";
+import { checkboxButton, toggleCheck } from "./check.js";
 
 const form = document.getElementById('form');
 const list = document.getElementById('list');
@@ -10,7 +10,7 @@ jsList.forEach(element => {
     createElement(element);
     const tag = document.querySelector("[data-id='"+element.id+"']");
     if(jsList[jsList.findIndex(el => el.id == tag.dataset.id)].done == true) {
-        checkElement(tag.childNodes[1], tag.dataset.id);
+        toggleCheck(tag.childNodes[1], tag.dataset.id);
     }
 });