pomodoro app

What challenges did you encounter, and how did you overcome them?

Recreating the circular timer was challenging. I first used conic-gradient, but it could not replicate the rounding ends. So I used svg patterns for that. Then, I noticed a glowing circular pattern around the colored progress bar. I used a conic pattern for that, but I had a hard time figuring exact way of using the method and how to change the appearance based on the time remaining. The final result may not be perfect, but it looked good enough for me.

Creating custom spinners was a bit tedious. I had to hide the default arrows and replaced with icons provided in the asset folder. I am not really satisfied with the look but it is functioning, so I thought was good enough. I am not sure if there is a better way to do it, but I basically stack the two up/down icons and position the pair into the input box.

What specific areas of your project would you like help with?

The JavaScript got a bit messy and needs refactoring. I appreciate if you have any suggestions on how to clean it up. As always, I welcome any comments/suggestions.