Todo-list app

An advanced version of todo-list app with additional functionality. Todoist was used as an inspiration and example for design.

Live preview on GitHub Pages

Tech stack used

• HTML
• TailwindCSS
• VanillaJS, Flowbite, Tailwind Elements
• Webpack

Functionality

Todos

• adding/deleting/duplicating/editing a single task
• adding additional info to the task: expire date/time, priority (colored), level of difficulty
• saving task to a localStorage after page close
• highlighting expired tasks with red

Sections

• adding additional sections that can contain their own tasks
• editing/deleting/duplicating sections

History

• saving task to the history after comleting
• deleting/restoring items from history
• saving history after page close

Additional functionality

You can edit a separate task in several ways either it's a single minor change like date, time etc. or multiple changes:

• via task form
• via task dropdown
• via modal window
• via single todo badges

In history you can pick multiple tasks just by clicking or tapping on items and delete/restore them or clear the choice.