This responsive app is designed for people to have a live clock running on their screens with their goal for the day as a reminder.
This app was designed, with simplistic and responsive features which helps benefit the user by being a daily reminder of the time and their goals. It includes a live clock, a task input, and beautiful landscape backgrounds to make the user's screen pop.
-
Beautiful landscape portrait backgrounds that change based on the local's time of the day.
-
If the hour is less than 8 AM, then the backgroud automatically switches to a morning type background.
-
If the hour is less than 11 AM, then the background automatically switches to a day type background.
-
If the hour is less than 8 PM, then the background automatically switches to an afternoon type background.
-
If the hour is more than 8 PM, then the background automatically switches to a night type background.
-
- Live Clock that presents the time(hours, minutes & seconds) of day based on local host, with an AM/PM session.
-
Good Morning text
-
Good Day text
-
Good Afternoon text
-
Good Night text
- 'What is your focus today?' text.
- User 24h format instead of 12.
- Add more inputs for daily tasks
- Add a deadline feature.
- Design and style the live clock feature.
- Add feature where user can choose from various backgrounds and set them manually.
All app's features and interactivity function as intended, various testings were conducted.
-
HTML
- No errors returned when passing through the official W3C Validator
-
CSS
- No errors were found when passing through the official (Jigsaw) Validator
-
JS
- No errors were found when passing through JSHint
None found.
- The site was deployed to GitHub pages.
Live link: https://stevealsamarae.github.io/JS-MSP2/
Github link: https://github.com/SteveAlsamarae/JS-MSP2
-
Credits Code Institude, tasks taught me a lot on how to put together. Help from mentor, and the slack community.
-
Credits Udemy for also offering me a course that I have undertaken.
-
Credits W3schools.
The concept of this app is not original.
- All images used were taken from