jwgatt / pomodoro-clock

Minimal code React pomodoro clock

Home Page:pomodoro-clock-jwgatt.vercel.app

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

pomodoro-clock

Working with Material Symbols and a barebones react config, using LiveServer instead of create-react-app. Attempt at building a Pomodoro clock using a minimal amount of code, currently the application can:-

  • Play/pause current time
  • Change break/session length
  • Play sound on break/session ending
  • Reset the timer to stated session length

TODO

  • element with id="break-label" that contains a string (e.g. "Break Length").
  • element with id="session-label" that contains a string (e.g. "Session Length").
  • two clickable elements with corresponding IDs: id="break-decrement" and id="session-decrement".
  • two clickable elements with corresponding IDs: id="break-increment" and id="session-increment".
  • element with a corresponding id="break-length", which by default (on load) displays a value of 5.
  • Reduce margin between title and time in dual container grid.
  • Reduce margin between arrows and time in single containers.
  • Increase button size
  • Replace button css styling with html element tags
  • Add start sound

About

Minimal code React pomodoro clock

pomodoro-clock-jwgatt.vercel.app


Languages

Language:JavaScript 73.9%Language:HTML 13.7%Language:CSS 12.4%