Feed back on pomodoro timer

I completed the project using Angular 8, and i’m looking for feed back on the code.
DEMO
Source Code

The desgin was inspired by this Dribbble

When I increase the text only your design breaks (or at least I don’t think you will be happy with it). If you don’t know what I am referring to, using FF, go to the Tools menu -> Zoom -> activate Text Only. Then hold down the Ctrl key while you scroll the middle mouse button.

When the timer is running I cannot click on the Trashcan icon via the keyboard (it appears you need to mouse hover to make that icon appear). Actually, now I see that if I tab once from the pause button and hit Return, the timer display disappears, so the Trashcan icon is there, just not visible.

Backwards tabbing from the pause icon puts the keyboard focus on the elements underneath the timer display. If the display is acting as a modal then those elements underneath should probably lose their keyboard focus.

Sorry to be so picky, but you should always make sure that you can use both the mouse and keyboard properly.

1 Like

Thanks for the honest feedback. Will look into those issues when i have the time :+1: