diff options
| -rw-r--r-- | app/delete.js | 2 | ||||
| -rw-r--r-- | app/edit.js | 1 | ||||
| -rw-r--r-- | app/list.js | 6 | ||||
| -rw-r--r-- | index.html | 8 | ||||
| -rw-r--r-- | main.css | 17 |
5 files changed, 16 insertions, 18 deletions
diff --git a/app/delete.js b/app/delete.js index df4feb7..c595505 100644 --- a/app/delete.js +++ b/app/delete.js @@ -15,8 +15,6 @@ export function deleteButton(id) { function deleteElement(element, id) { element.remove(); - jsList.splice(jsList.findIndex(el => el.id === id), 1); - localStorage.setItem('jsList', JSON.stringify(jsList)); }
\ No newline at end of file diff --git a/app/edit.js b/app/edit.js index 791f43e..831edc3 100644 --- a/app/edit.js +++ b/app/edit.js @@ -21,7 +21,6 @@ function editElement(element, id) { input.value = element.childNodes[0].textContent; form.appendChild(input); - hide(element); form.addEventListener('submit', (e) => { diff --git a/app/list.js b/app/list.js index 2469dad..bb658e5 100644 --- a/app/list.js +++ b/app/list.js @@ -41,15 +41,11 @@ form.addEventListener('submit', (submit) => { function createElement(item) { const newItem = document.createElement('li'); newItem.classList.add('item'); - newItem.dataset.id = item.id; - newItem.textContent += item.name; newItem.appendChild(checkboxButton(item.id)); - - newItem.appendChild(editButton(item.id)); - + newItem.appendChild(editButton(item.id)); newItem.appendChild(deleteButton(item.id)); list.appendChild(newItem); @@ -1,17 +1,17 @@ <!DOCTYPE html> -<html> +<html lang="en"> <head> <meta charset='utf-8'> <meta http-equiv='X-UA-Compatible' content='IE=edge'> - <title>To-Do-List</title> <meta name='viewport' content='width=device-width, initial-scale=1'> + <title>To-Do-List</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css"> - <link rel='stylesheet' type='text/css' media='screen' href='main.css'> + <link rel='stylesheet' type='text/css' rel='stylesheet' href='main.css'> </head> <body> <main> - <h1>To-Do-List</h1> <div class="container"> + <h1>To-Do-List</h1> <ul class="list" id="list"> <form action="" id="form" method="post"> <input autofocus type="text" name="add" class="add" placeholder="What do you need to do?" maxlength="250"> @@ -1,8 +1,13 @@ @import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap'); +:root { + --white: #eee; + --black: #111; +} + body { - background-color: #eee; - color: #111; + background-color: var(--white); + color: var(--black); font-family: 'Roboto', sans-serif; text-align: center; } @@ -23,13 +28,13 @@ h1 { min-width: 15vw; max-width: 30vw; overflow: auto; - border: 5px solid #111; + border: 5px solid var(--black); padding: 2rem 6rem; } input { - background-color: #eee; - color: #111; + background-color: var(--white); + color: var(--black); } .add { @@ -38,7 +43,7 @@ input { } .item { - border: 3px solid #111; + border: 3px solid var(--black); margin: 0.3rem; padding: 0.4em 3em; list-style-type: none; |