vaarunh/lets-do-it

A simple ToDo List webapp created using JavaScript, HTML & CSS.

Let's Do It

A simple ToDo List webapp created using JavaScript, HTML & CSS.

APIs Used

1. UnSplash: https://source.unsplash.com/
2. Type.Fit: https://type.fit/api/quotes

Demo

Live Preview: https://varunherlekar.github.io/lets-do-it/

Screenshot

Hacktober Fest 2021 Contributors ✨

lets-do-it's Issues

Improve User Interface

Hi @varunherlekar

I think the overall user interface can be improved. Do you have any plans for redesign?

Also, do we need the APIs for displaying quotes and wallpapers? We can instead have one static fixed background as a wallpaper and work on the overall theme of the web app.

Let me know your thoughts, and we can work together on this. 🙂

Improve UI: Footer

Hey @varunherlekar , this is actually a great project and you have maintained a nice repository. I want to contribute to this project by improving the UI of the website a bit. For now, I want to improve the footer design and placement on the page. I am a Graphics Designer by passion, so kindly assign me this issue so that I can get my first PR for Hacktoberfest '21 merged.

Add a cross out/strikethough to completed task list.

Beautiful Transitions

Can I add Some transitions to Elements?

Add icons to the buttons

add icons to the buttons of the to-do list

Option to remove the task once it has been marked completed

Hi @varunherlekar, while using the webapp, I noticed that once tasks have been completed, they can no longer be removed from the 'completed tasks' section. I think if a feature was implemented to clear the completed list, this app could be used over and over for different sets of tasks by the same user without cluttering the completed tasks section.

I'd like to implement this. Thanks.

home preview Ui Design

hello sir,

After exploring your live demo website, I thought that the footer size should be little bit lower height and the general message should be created on a box and the task column in one box. If you assign me this work, will surely do my best @varunherlekar sir.

Feature to store tasks persistent

The list gets cleared on refreshing website
I would like to implement solution to keep them persistent

to fix when empty task is added

hello @varunherlekar , I am a beginner to open source. Right now, when empty tasks are added, nothing happens. I would like to take up this issue and add an error message.
I would like this to be my contribution to hacktoberfest2021. Can you please assign this issue to me?

Fix UI: Header and color pallet

Hi @varunherlekar , Amazing project brother! I am into UI and styling, would like to fix the following issues:

1. Fix: Header is currently taking 1/3rd of the entire screen, which leads to cluttering of main content i.e. ToDo List. I will snug fit the header so that it takes space according to the content inside it. This will give more breathing space to ToDo List
2. Style: Current color pallet of the header and footer is not going hand-in-hand with each other. Would like to work on this also.

Please assign this to me, and this would be my first PR merge ever!

Add a list of completed tasks.

Persistence for tasks

The list gets cleared on refreshing website
I would like to implement solution to keep them persistent

Can you assign this to me?

Feature to restore the completed task.

Feature request: Change background picture

I'd like to be able to change the background picture, maybe to another room or something more abstract.
I was thinking one could add a button perhaps to flip through an image folder?
Thoughts?
☺

Feature Request: Provision to categorize a set of tasks

A user may want to create multiple to-do tasks and list them as per their categories. For example, a user can have two categories such as:

1. Shopping
2. Study

The "Shopping" category may have tasks/to-do items like "buy milk", "buy groceries", "buy clothes", etc. whereas the "Study" category may have tasks/to-do items like "complete assignment", "solve math", "meet up for group study", etc.

@varunherlekar what are your thoughts on this?

Cursor with hovering effect

Could I made the cursor to display differently when hovering onto Add Item, Current Item, and Completed Item?
E.g. "+" sign for Add item, loading sign for Current Item, and checked sign for Completed Item.
Cheers,
Alex.

Edit Task Button Not Working.

Search a particular task

Can I add this feature under Hacktoberfest contribution?

Giving indicative class names for all elements

For some reason, all of the elements created in app.js have class names of CSS properties, instead of indicative names.
It also makes it harder to design the UI.

Improve user experience

Hi @varunherlekar I am a QA Tester and while testing your project I found some user experience issue as below :
While editing the task it should show 'Save' button instead of 'Edit'.

"Note: If you don't mind, please allow me to open more issues and report bugs so that we can work together on improving this project."

No space in contact section between two anchor tags.

Item not getting removed from completed tasks

When an item is removed from completed tasks, it reappears due to not being deleted from browser localstorage

Single function for onclick actions in the completed tasks section

Hi @varunherlekar, I think we should consolidate the onClick code for the list items in the completed tasks section into a single function and add it as an addEventListener to the completedItems variable.
Currently, it exists as separate functions.

I think this will help clean up the code.
I would like to work on this. Thanks.