# pooya1484/analog-digital-clock architecture

> Architecture diagram of the GitHub repository pooya1484/analog-digital-clock, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-09). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/pooya1484/analog-digital-clock
- Repository: https://github.com/pooya1484/analog-digital-clock

## Overview

This is a small browser clock: the user opens the page, and JavaScript updates analog hand rotations and the digital time display. The README also describes the dark neumorphic theme and glowing hands. The HTML and CSS files are present in the tree but were not sampled, so their internal structure and styling relationships are not inferred.

Main entry points: [`index.html`](https://github.com/pooya1484/analog-digital-clock/blob/main/index.html) (Clock page), [`index.js`](https://github.com/pooya1484/analog-digital-clock/blob/main/index.js) (Clock updater)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_presentation["Clock presentation"]
  node_page["Clock page<br/>[index.html]"]
  node_theme["Visual theme<br/>[style.css]"]
  node_fonts["Font styles<br/>[fonts.css]"]
end

subgraph group_runtime["Clock runtime"]
  node_updater["Clock updater<br/>[index.js]"]
end

node_user(("User"))

node_user -->|"opens"| node_page
node_updater -->|"updates displays"| node_page

click node_page "https://github.com/pooya1484/analog-digital-clock/blob/main/index.html"
click node_theme "https://github.com/pooya1484/analog-digital-clock/blob/main/style.css"
click node_fonts "https://github.com/pooya1484/analog-digital-clock/blob/main/fonts.css"
click node_updater "https://github.com/pooya1484/analog-digital-clock/blob/main/index.js"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_page,node_theme,node_fonts,node_user toneBlue
class node_updater toneAmber
```

## Components

### Clock presentation

- [Clock page](https://github.com/pooya1484/analog-digital-clock/blob/main/index.html): `index.html`
- [Visual theme](https://github.com/pooya1484/analog-digital-clock/blob/main/style.css): `style.css`
- [Font styles](https://github.com/pooya1484/analog-digital-clock/blob/main/fonts.css): `fonts.css`

### Clock runtime

- [Clock updater](https://github.com/pooya1484/analog-digital-clock/blob/main/index.js): `index.js`

### Other components

- **User**

## Connections

- User → Clock page: opens (evidence: `README.md`)
- Clock updater → Clock page: updates displays (evidence: `index.js`)