anita00001/To-do-List

Enhancement opportunity: To-do-List

Closed this issue · 1 comments

Highlights

✔ Linters check passed
✔Descriptive README.md file
✔ Proper implementation of add, remove, checked, and edit functionality

Issues:

Issue File
1 index.html
2 style.css
3 localstorage.js
4 completedCheck.js
Issue on index.html:
  • <header> tag would be appropriate tag instead of <div>

image

Issue on style.css:
  • display: flex; align-items: center; is repeated in body, .title, and .new-task

image
image
image

These properties can be grouped and written in a single block as,
image

  • border-bottom: 2px solid lightgray; is repeated three times in .title, .new-task and

image
image
image

These properties can be grouped and written only once.

  • cursor: pointer is used five times in the file specifically in .title > i, #press-enter, .task-row > input, .task-row i, and #clear-button
    - Don't Repeat Yourself, target button, i and input and grouped them together.

  • color: rgba(0, 0, 0, 0.25) is used three times specifically in .title > i, #press-enter and .task-row i
    - Don't Repeat Yourself, target button, i and input and grouped them together.

  • border: none; is used four times specifically in input[type=text], #press-enter, .task-row .options button and #clear-button
    - Don't Repeat Yourself, target button, p and input and grouped them together.

  • Targeted class is never created!
    image

Issue in localstorage.js:
  • Functions can be converted into arrow function
    image
    image

  • getFromStorage function can be written short-hand-code
    image

Issue on completedCheck.js:
  • toggleCompleted function can be written short-hand-code
    image

Applied every issues mentioned above