https://github.com/atia-farha/clock
A sleek and modern clock website featuring both analog and digital displays with timezone and date information. The clock dynamically updates in real time making it a functional and elegantly designed clock that provides a seamless experience for users!!!
https://github.com/atia-farha/clock
analog-clock css3 date-time digital-clock digital-clock-and-date digital-clock-html-css-javascript digital-clock-javascript html-css-javascript html5 javascript time timezone
Last synced: 4 months ago
JSON representation
A sleek and modern clock website featuring both analog and digital displays with timezone and date information. The clock dynamically updates in real time making it a functional and elegantly designed clock that provides a seamless experience for users!!!
- Host: GitHub
- URL: https://github.com/atia-farha/clock
- Owner: Atia-Farha
- License: other
- Created: 2024-11-21T13:43:20.000Z (11 months ago)
- Default Branch: main
- Last Pushed: 2025-01-05T04:25:45.000Z (9 months ago)
- Last Synced: 2025-01-05T05:21:01.994Z (9 months ago)
- Topics: analog-clock, css3, date-time, digital-clock, digital-clock-and-date, digital-clock-html-css-javascript, digital-clock-javascript, html-css-javascript, html5, javascript, time, timezone
- Language: JavaScript
- Homepage: https://atia-farha.github.io/clock/
- Size: 98.6 KB
- Stars: 1
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Clock Website
A sleek and modern clock website featuring both analog and digital displays, with timezone and date information. The clock dynamically updates in real time, making it a functional and elegantly designed clock that provides a seamless experience for users.
## Table of Contents
- [Project Structure](#project-structure)
- [Technologies Used](#technologies-used)
- [Features](#features)
- [Usage](#usage)
- [Reporting Issues](#reporting-issues)
## Project Structure
```plaintext
clock/
├── index.html # Main HTML file
├── src/ # Source code directory
│ ├── css/ # Directory for stylesheets
│ │ └── style.css # Main CSS file for styling
│ └── js/ # Directory for JavaScript files
│ └── script.js # Core JavaScript functionality
├── assets/ # Directory for static assets
│ ├── favicon.png
│ └── preview.png
├── README.md # Project documentation
└── LICENSE # License file
```
## Technologies Used
- HTML
- CSS
- JavaScript
## Features
- **Dynamic Greeting:** Offers a contextual greeting based on the current day.
- **Day and Date Display:** Shows the current day of the week and the date in a user-friendly format.
- **Real-Time Analog Clock:** A beautifully animated clock with accurate hour, minute, and second hands.
- **Digital Time Display:** A simultaneous digital time display alongside the analog clock.
- **Timezone Information:** Displays the user's timezone and GMT offset.
## Usage
1. Make sure you have a web browser (such as Chrome, Firefox, etc.) installed on your device. If not, please install one.
2. Simply open this link.
3. Enjoy the analog clock with real-time updates, digital display, and timezone information.
## Reporting Issues
If you encounter any bugs or have suggestions for improvement, please report them in the Issues section of this GitHub repository. I will address them promptly.
---
© Designed and developed by Atia Farha | ALL RIGHTS RESERVED