search

Kritika30032002 / To-Do-List-Application

This is a To Do List Application
https://simply-tasked-list.netlify.app/
MIT License
83 stars 127 forks source link

Enhancing the overall User Interface. #257

Closed Harsh2504 closed 10 months ago

Harsh2504 commented 11 months ago

I can contribute on these improvements :

  1. Making the website design look more minimalist
  2. Improve the todo card's layout and arrangement
  3. Fixing overall layout
  4. better color theme
  5. improving input fields ,buttons styling
  6. Adding footer (consist of project owner name and little info as you suggest)
  7. replace start voice command button with responsive mic icon (if you agree)

can I work on these changes?

Kritika30032002 commented 11 months ago

design approval depends to be approved.

Also I would like to have demo of mic icon i.e. what it is exactly?

Kritika30032002 commented 11 months ago

program name?

Harsh2504 commented 11 months ago

program name? code peak 2023

Harsh2504 commented 11 months ago

design approval depends to be approved.

Also I would like to have demo of mic icon i.e. what it is exactly? then i will start working and share the design with you after its finished for approval .Then i will create pr.

mic icon : means instead of those text i will create a mic type circular icon and try to make it interactive.

Kritika30032002 commented 11 months ago

okay

Harsh2504 commented 11 months ago

i have made these UI changes uptil now. let me know how it is : https://github.com/Kritika30032002/To-Do-List-Application/assets/104843006/ed9b5aea-3817-44ab-a830-c01416a90ee0

Still going to do few improvements for modals , input field and popups .

Harsh2504 commented 11 months ago

I have completed my contribution and came with this User interface:

The video is compressed so quality might be lossed:

https://github.com/Kritika30032002/To-Do-List-Application/assets/104843006/c4d125af-87ed-4cfa-9fd8-e198543855a7

All UI changes mentioned in the issue were made:

I have made Additional changes :

  1. Make Search bar appear only when cards are added and hide when no cards are present.
  2. Improved Dark mode a lot:
    • Customised everything to match the theme
    • Even Added Dark Mode colors to show Task priority
  3. When Check Box is checked Task card color changes to indicate task completed . There is separate color introduced for this in Dark mode too.
  4. When CheckBox is checked indicating task completed Edit button hides.
  5. These two changes can be toggled by unchecking checkbox too.
  6. When Edit Button is clicked title changes from "Add your Task below:" to "Edit your Task below:" and toggles when Task is successfully edited.
  7. Improved styling of alerts .(Task not entered!!! ,etc)
  8. Improved styling of Modals for dark mode.
  9. Added Smooth animations to the web page
  10. Added title of web application to Preloader

I have spent lot of time for this contribution and improved this a lot by doing additional changes . I hope these additional changes will be considered for a lot of Extra points. I will be happy if you do so i loved contributing to your project .

And if you want me to stop the footer marque and add your github ,LinkedIn or other links to it you can tell me.

Thank You!!!

Should i create pr now ? please tell me when too.

Kritika30032002 commented 11 months ago

yes you can create a pr for this AS SOON AS POSSIBLE

And if you want me to stop the footer marque and add your github ,LinkedIn or other links to it you can tell me. CREATE SEPARATE ISSUE FOR THIS

jitendrasuthar1998 commented 11 months ago

@Kritika30032002 Hello Kritika. The issue I was supposed to work on is already listed by @Harsh2504 in this comment's additional changes section's first point.

If he hasn't raised a pull request yet or hasn't worked on that issue, can I work on the issue of "Make Search bar appear only when cards are added and hide when no cards are present"?

Shivani-Sharma-23 commented 10 months ago

Can i do some changes to give it a minimalistic look