# tirthajas/personal-portfolio architecture

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

- Interactive diagram: https://gitdiagram.com/tirthajas/personal-portfolio
- Repository: https://github.com/tirthajas/personal-portfolio

## Overview

This is a static personal portfolio site. Its visible workflow is a visitor browsing the portfolio and interacting with project cards, navigation, and scrolling; script.js supplies the sampled interactive behavior and builds project cards from its project data. The tree also includes stylesheet, image, and legal-page assets, but their contents and wiring were not sampled, so their relationships are left unspecified.

Main entry points: [`script.js`](https://github.com/tirthajas/personal-portfolio/blob/main/script.js) (Portfolio interactions), [`images`](https://github.com/tirthajas/personal-portfolio/tree/main/images) (Project images)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_site["Portfolio site"]
  node_portfolio["Portfolio page<br/>[index.html]"]
  node_styling["Site styling<br/>[style.css]"]
  node_project_images["Project images"]
  node_legal_pages["Legal pages<br/>[privacy.html]"]
  node_terms["Terms page<br/>[terms.html]"]
end

subgraph group_behavior["Page behavior"]
  node_interactions["Portfolio interactions<br/>[script.js]"]
end

node_visitor(("Visitor"))

node_visitor -->|"triggers UI events"| node_interactions
node_interactions -->|"uses image paths"| node_project_images

click node_portfolio "https://github.com/tirthajas/personal-portfolio/blob/main/index.html"
click node_styling "https://github.com/tirthajas/personal-portfolio/blob/main/style.css"
click node_project_images "https://github.com/tirthajas/personal-portfolio/tree/main/images"
click node_legal_pages "https://github.com/tirthajas/personal-portfolio/blob/main/privacy.html"
click node_terms "https://github.com/tirthajas/personal-portfolio/blob/main/terms.html"
click node_interactions "https://github.com/tirthajas/personal-portfolio/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_portfolio,node_styling,node_project_images,node_legal_pages,node_terms toneBlue
class node_interactions toneAmber
class node_visitor toneIndigo
```

## Components

### Portfolio site

- [Portfolio page](https://github.com/tirthajas/personal-portfolio/blob/main/index.html): `index.html`
- [Site styling](https://github.com/tirthajas/personal-portfolio/blob/main/style.css): `style.css`
- [Project images](https://github.com/tirthajas/personal-portfolio/tree/main/images): `images`
- [Legal pages](https://github.com/tirthajas/personal-portfolio/blob/main/privacy.html): `privacy.html`
- [Terms page](https://github.com/tirthajas/personal-portfolio/blob/main/terms.html): `terms.html`

### Page behavior

- [Portfolio interactions](https://github.com/tirthajas/personal-portfolio/blob/main/script.js): `script.js`

### Other components

- **Visitor**

## Connections

- Visitor → Portfolio interactions: triggers UI events (evidence: `script.js`)
- Portfolio interactions → Project images: uses image paths (evidence: `script.js`)