# nchabashvili/iamacwebsite architecture

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

## Overview

IAMAC is a static architecture-firm portfolio: visitors browse the firm’s introduction and contact information, explore project listings, and open individual project pages with descriptions and imagery. The README documents responsive styling and navigation; the tree identifies separate listing data and gallery behavior. Source excerpts were limited, so the graph does not assume how pages load or connect the project data to the rendered pages.

Main entry points: [`project/project.html`](https://github.com/nchabashvili/iamacwebsite/blob/main/project/project.html) (Project detail), [`footer.js`](https://github.com/nchabashvili/iamacwebsite/blob/main/footer.js) (Footer component), [`index.html`](https://github.com/nchabashvili/iamacwebsite/blob/main/index.html) (Home and firm info), [`projects.html`](https://github.com/nchabashvili/iamacwebsite/blob/main/projects.html) (Project listing)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_pages["Portfolio pages"]
  node_home["Home and firm info<br/>[index.html]"]
  node_listing["Project listing<br/>[projects.html]"]
  node_detail["Project detail<br/>[project.html]"]
end

subgraph group_presentation["Visual presentation"]
  node_sitecss["Site styling<br/>[app.css]"]
  node_listingcss["Listing styling<br/>[projects.css]"]
  node_gallerycss["Gallery styling<br/>[gallery.css]"]
  node_footer["Footer component<br/>[footer.js]"]
end

subgraph group_content["Project content"]
  node_projectdata["Project data<br/>[projects.json]"]
  node_images["Project images"]
  node_gallery["Gallery controls<br/>[scripts.js]"]
end

node_visitor(("Visitor"))
node_instagram(("Instagram"))

node_visitor -->|"opens"| node_home
node_visitor -->|"browses"| node_listing
node_visitor -->|"views"| node_detail
node_detail -->|"uses controls"| node_gallery
node_footer -.->|"links to"| node_instagram

click node_home "https://github.com/nchabashvili/iamacwebsite/blob/main/index.html"
click node_listing "https://github.com/nchabashvili/iamacwebsite/blob/main/projects.html"
click node_detail "https://github.com/nchabashvili/iamacwebsite/blob/main/project/project.html"
click node_projectdata "https://github.com/nchabashvili/iamacwebsite/blob/main/projects.json"
click node_images "https://github.com/nchabashvili/iamacwebsite/tree/main/imgsLow"
click node_gallery "https://github.com/nchabashvili/iamacwebsite/blob/main/project/scripts.js"
click node_sitecss "https://github.com/nchabashvili/iamacwebsite/blob/main/app.css"
click node_listingcss "https://github.com/nchabashvili/iamacwebsite/blob/main/projects.css"
click node_gallerycss "https://github.com/nchabashvili/iamacwebsite/blob/main/project/gallery.css"
click node_footer "https://github.com/nchabashvili/iamacwebsite/blob/main/footer.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_home,node_listing,node_detail toneBlue
class node_sitecss,node_listingcss,node_gallerycss,node_footer toneAmber
class node_projectdata,node_images,node_gallery toneMint
class node_visitor,node_instagram toneIndigo
```

## Components

### Portfolio pages

- [Home and firm info](https://github.com/nchabashvili/iamacwebsite/blob/main/index.html): `index.html`
- [Project listing](https://github.com/nchabashvili/iamacwebsite/blob/main/projects.html): `projects.html`
- [Project detail](https://github.com/nchabashvili/iamacwebsite/blob/main/project/project.html): `project/project.html`

### Visual presentation

- [Site styling](https://github.com/nchabashvili/iamacwebsite/blob/main/app.css): `app.css`
- [Listing styling](https://github.com/nchabashvili/iamacwebsite/blob/main/projects.css): `projects.css`
- [Gallery styling](https://github.com/nchabashvili/iamacwebsite/blob/main/project/gallery.css): `project/gallery.css`
- [Footer component](https://github.com/nchabashvili/iamacwebsite/blob/main/footer.js): `footer.js`

### Project content

- [Project data](https://github.com/nchabashvili/iamacwebsite/blob/main/projects.json): `projects.json`
- [Project images](https://github.com/nchabashvili/iamacwebsite/tree/main/imgsLow): `imgsLow`
- [Gallery controls](https://github.com/nchabashvili/iamacwebsite/blob/main/project/scripts.js): `project/scripts.js`

### Other components

- **Visitor**
- **Instagram**

## Connections

- Visitor → Home and firm info: opens
- Visitor → Project listing: browses
- Visitor → Project detail: views
- Project detail → Gallery controls: uses controls
- Footer component → Instagram: links to