# joaoluisdutra/adidas-landing-page architecture

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

- Interactive diagram: https://gitdiagram.com/joaoluisdutra/adidas-landing-page
- Repository: https://github.com/joaoluisdutra/adidas-landing-page

## Overview

A small browser-based carousel: the page supplies its markup, and the script wires previous/next clicks to wrap through slides while updating the active slide and indicators. The HTML structure is inferred from selectors in the sampled script; the markup itself was not sampled.

Main entry points: [`index.html`](https://github.com/joaoluisdutra/adidas-landing-page/blob/main/index.html) (Carousel page), [`script.js`](https://github.com/joaoluisdutra/adidas-landing-page/blob/main/script.js) (Carousel logic)

## Diagram (Mermaid)

```mermaid
flowchart TD

node_visitor(("Visitor"))
node_page["Carousel page<br/>[index.html]"]
node_carousel["Carousel logic<br/>[script.js]"]

node_page -->|"loads script"| node_carousel
node_carousel -->|"binds handlers"| node_page
node_visitor -->|"clicks controls"| node_page
node_page -->|"dispatches clicks"| node_carousel
node_carousel -->|"updates slide and indicators"| node_page

click node_page "https://github.com/joaoluisdutra/adidas-landing-page/blob/main/index.html"
click node_carousel "https://github.com/joaoluisdutra/adidas-landing-page/blob/main/script.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_visitor toneIndigo
class node_page,node_carousel toneTeal
```

## Components

### Other components

- **Visitor**
- [Carousel page](https://github.com/joaoluisdutra/adidas-landing-page/blob/main/index.html): `index.html`
- [Carousel logic](https://github.com/joaoluisdutra/adidas-landing-page/blob/main/script.js): `script.js`

## Connections

- Carousel page → Carousel logic: loads script
- Carousel logic → Carousel page: binds handlers
- Visitor → Carousel page: clicks controls
- Carousel page → Carousel logic: dispatches clicks
- Carousel logic → Carousel page: updates slide and indicators