Task list

About

Task list with the functionality of adding new tasks, marking tasks as done and removing tasks from the list. If any task is entered into the list, two buttons appear: to mark all tasks as done, and to hide all tasks marked as done. If all tasks are marked as complete, the mark all button is disabled. Project done as a part of front-end development course at YouCode.

Demo:

https://gosia-ras.github.io/task-list/ <- check out here how it works

Tools:

• HTML
• CSS
• BEM
• ES6+
• Grid
• Flexbox

Instructions:

1. Type in the task in the input field.
2. Click the "click to add" button.
3. The task will appear in the list below the input field.
4. Using the green button the task can be marked as done.
5. Using the red button the task can be removed from the list.
6. Clicking on button "mark all done" sets the status of all tasks to done. The button is disabled if all tasks are marked as done.
7. Clicking on button "hide all done" toggles the status of all finished tasks to hidden. Clicking on it again shows the list.