# sudham15/sudharshan-portfolio architecture

> Architecture diagram of the GitHub repository sudham15/sudharshan-portfolio, 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/sudham15/sudharshan-portfolio
- Repository: https://github.com/sudham15/sudharshan-portfolio

## Overview

This is a small browser-based webpage. Its visible runtime behavior is a four-slide carousel controlled by JavaScript, which finds the slider in the page and toggles slide visibility. The script also initializes AOS animations. The HTML and generated CSS are present in the tree, but their contents were not provided, so their specific structure and connections are uncertain.

Main entry points: [`src/main.js`](https://github.com/sudham15/sudharshan-portfolio/blob/main/src/main.js) (Slide carousel), [`src/index.html`](https://github.com/sudham15/sudharshan-portfolio/blob/main/src/index.html) (Page markup)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_page["Webpage"]
  node_page_html["Page markup<br/>[index.html]"]
  node_slider["Slide carousel<br/>[main.js]"]
  node_aos["AOS animation"]
  node_page_styles["Page styles<br/>[output.css]"]
end

node_visitor(("Visitor"))

node_slider -->|"selects slider DOM"| node_page_html
node_slider -->|"initializes"| node_aos

click node_page_html "https://github.com/sudham15/sudharshan-portfolio/blob/main/src/index.html"
click node_slider "https://github.com/sudham15/sudharshan-portfolio/blob/main/src/main.js"
click node_page_styles "https://github.com/sudham15/sudharshan-portfolio/blob/main/src/output.css"

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_html,node_slider,node_aos,node_page_styles toneBlue
class node_visitor toneIndigo
```

## Components

### Webpage

- [Page markup](https://github.com/sudham15/sudharshan-portfolio/blob/main/src/index.html): `src/index.html`
- [Slide carousel](https://github.com/sudham15/sudharshan-portfolio/blob/main/src/main.js): `src/main.js`
- **AOS animation**
- [Page styles](https://github.com/sudham15/sudharshan-portfolio/blob/main/src/output.css): `src/output.css`

### Other components

- **Visitor**

## Connections

- Slide carousel → Page markup: selects slider DOM (evidence: `src/main.js`)
- Slide carousel → AOS animation: initializes (evidence: `src/main.js`)