The webpage is designed with no frameworks and no libraries it is purely with vanilla javascript ,html,css.
- The first step of project is index.html, it has metadata,links for fonts,icons,css and scripts.
- The second step is to style the page and for animation is done by js,for the clock hands.
- The last step is to run the clock hands with the animations using javascript,managing motion of hands and also to create set and delete lists of alarms ,adding the icons that are needed.
You can visit the webpage here
- Multiple Alarms can be set
- Live Time can be seen
- Delete an Alarm that is set
- You can change the time settings using up and down arrows.
- When you can hover(move mouse pointer) on the alarm icon ,it shows green color as t to say it can set an alarm.
- When you hover(move mouse pointer) on the delete icon, it shows the red color as to say it can delete
- The time that is set to an alarm is alarmed then it changes its color form initial red to orange.
Clone the project
git clone https://usernamezero.github.io/AlarmClock/
Go to the project directory
cd AlarmClock/
Javascript, HTML, CSS.