# gswgaston/sitefabiana architecture

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

## Overview

This repository is a React one-page website for a neuropsychopedagogy practice. Visitors move from the introduction through audience and service information, practitioner credentials, care locations and FAQs, then reach consultation calls to action and contact links. The page is composed by App; its content sections are presentation stages rather than backend workflow or stored records. The source excerpts confirm composition and selected section-to-decoration calls; other section implementations and contact behavior were not sampled, so those internal links are not inferred.

Main entry points: [`src/App.tsx`](https://github.com/gswgaston/sitefabiana/blob/main/src/App.tsx) (Landing page), [`src/components/decorations/PuzzlePieces.tsx`](https://github.com/gswgaston/sitefabiana/blob/main/src/components/decorations/PuzzlePieces.tsx) (Puzzle motif), [`src/components/decorations/LayeredWaves.tsx`](https://github.com/gswgaston/sitefabiana/blob/main/src/components/decorations/LayeredWaves.tsx) (Wave dividers), [`src/components/Hero.tsx`](https://github.com/gswgaston/sitefabiana/blob/main/src/components/Hero.tsx) (Introduction)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_entry["Page entry"]
  node_mount["React mount<br/>[main.tsx]"]
  node_page["Landing page<br/>[App.tsx]"]
end

subgraph group_content["Practice information"]
  node_navigation["Navigation<br/>[Navbar.tsx]"]
  node_hero["Introduction<br/>[Hero.tsx]"]
  node_credentials["Credentials"]
  node_audience["Audience<br/>[Audience.tsx]"]
  node_services["Service stages<br/>[Services.tsx]"]
  node_about["Practitioner profile<br/>[About.tsx]"]
  node_locations["Care options<br/>[Locations.tsx]"]
  node_faq["FAQs<br/>[FAQ.tsx]"]
end

subgraph group_contact["Contact paths"]
  node_conversion["Consultation prompt"]
  node_footer["Footer links<br/>[Footer.tsx]"]
  node_whatsapp["WhatsApp shortcut<br/>[WhatsAppFloat.tsx]"]
end

subgraph group_visuals["Visual components"]
  node_puzzle["Puzzle motif<br/>[PuzzlePieces.tsx]"]
  node_doodles["Brand doodles<br/>[BrandDoodles.tsx]"]
  node_waves["Wave dividers<br/>[LayeredWaves.tsx]"]
  node_border["Puzzle border"]
end

node_visitor(("Site visitor"))

node_visitor -->|"opens"| node_mount
node_mount -->|"renders"| node_page
node_page -->|"renders"| node_navigation
node_page -->|"renders"| node_hero
node_page -->|"renders"| node_credentials
node_page -->|"renders"| node_audience
node_page -->|"renders"| node_services
node_page -->|"renders"| node_about
node_page -->|"renders"| node_locations
node_page -->|"renders"| node_faq
node_page -->|"renders"| node_conversion
node_page -->|"renders"| node_footer
node_page -->|"renders"| node_whatsapp
node_hero -->|"renders"| node_border
node_border -->|"renders"| node_puzzle
node_hero -->|"renders"| node_waves
node_hero -->|"renders"| node_doodles
node_audience -->|"renders"| node_puzzle
node_audience -->|"renders"| node_doodles
node_audience -->|"renders"| node_waves
node_services -->|"renders"| node_puzzle
node_services -->|"renders"| node_doodles
node_services -->|"renders"| node_waves
node_about -->|"renders"| node_puzzle
node_about -->|"renders"| node_doodles
node_locations -->|"renders"| node_puzzle
node_locations -->|"renders"| node_waves
node_faq -->|"renders"| node_puzzle
node_conversion -->|"renders"| node_waves

click node_mount "https://github.com/gswgaston/sitefabiana/blob/main/src/main.tsx"
click node_page "https://github.com/gswgaston/sitefabiana/blob/main/src/App.tsx"
click node_navigation "https://github.com/gswgaston/sitefabiana/blob/main/src/components/Navbar.tsx"
click node_hero "https://github.com/gswgaston/sitefabiana/blob/main/src/components/Hero.tsx"
click node_credentials "https://github.com/gswgaston/sitefabiana/blob/main/src/components/CredentialsStrip.tsx"
click node_audience "https://github.com/gswgaston/sitefabiana/blob/main/src/components/Audience.tsx"
click node_services "https://github.com/gswgaston/sitefabiana/blob/main/src/components/Services.tsx"
click node_about "https://github.com/gswgaston/sitefabiana/blob/main/src/components/About.tsx"
click node_locations "https://github.com/gswgaston/sitefabiana/blob/main/src/components/Locations.tsx"
click node_faq "https://github.com/gswgaston/sitefabiana/blob/main/src/components/FAQ.tsx"
click node_conversion "https://github.com/gswgaston/sitefabiana/blob/main/src/components/ConversionBanner.tsx"
click node_footer "https://github.com/gswgaston/sitefabiana/blob/main/src/components/Footer.tsx"
click node_whatsapp "https://github.com/gswgaston/sitefabiana/blob/main/src/components/WhatsAppFloat.tsx"
click node_puzzle "https://github.com/gswgaston/sitefabiana/blob/main/src/components/decorations/PuzzlePieces.tsx"
click node_doodles "https://github.com/gswgaston/sitefabiana/blob/main/src/components/decorations/BrandDoodles.tsx"
click node_waves "https://github.com/gswgaston/sitefabiana/blob/main/src/components/decorations/LayeredWaves.tsx"
click node_border "https://github.com/gswgaston/sitefabiana/blob/main/src/components/decorations/CornerPuzzleBorder.tsx"

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_mount,node_page toneBlue
class node_navigation,node_hero,node_credentials,node_audience,node_services,node_about,node_locations,node_faq toneAmber
class node_conversion,node_footer,node_whatsapp toneMint
class node_puzzle,node_doodles,node_waves,node_border toneRose
class node_visitor toneIndigo
```

## Components

### Page entry

- [React mount](https://github.com/gswgaston/sitefabiana/blob/main/src/main.tsx): `src/main.tsx`
- [Landing page](https://github.com/gswgaston/sitefabiana/blob/main/src/App.tsx): `src/App.tsx`

### Practice information

- [Navigation](https://github.com/gswgaston/sitefabiana/blob/main/src/components/Navbar.tsx): `src/components/Navbar.tsx`
- [Introduction](https://github.com/gswgaston/sitefabiana/blob/main/src/components/Hero.tsx): `src/components/Hero.tsx`
- [Credentials](https://github.com/gswgaston/sitefabiana/blob/main/src/components/CredentialsStrip.tsx): `src/components/CredentialsStrip.tsx`
- [Audience](https://github.com/gswgaston/sitefabiana/blob/main/src/components/Audience.tsx): `src/components/Audience.tsx`
- [Service stages](https://github.com/gswgaston/sitefabiana/blob/main/src/components/Services.tsx): `src/components/Services.tsx`
- [Practitioner profile](https://github.com/gswgaston/sitefabiana/blob/main/src/components/About.tsx): `src/components/About.tsx`
- [Care options](https://github.com/gswgaston/sitefabiana/blob/main/src/components/Locations.tsx): `src/components/Locations.tsx`
- [FAQs](https://github.com/gswgaston/sitefabiana/blob/main/src/components/FAQ.tsx): `src/components/FAQ.tsx`

### Contact paths

- [Consultation prompt](https://github.com/gswgaston/sitefabiana/blob/main/src/components/ConversionBanner.tsx): `src/components/ConversionBanner.tsx`
- [Footer links](https://github.com/gswgaston/sitefabiana/blob/main/src/components/Footer.tsx): `src/components/Footer.tsx`
- [WhatsApp shortcut](https://github.com/gswgaston/sitefabiana/blob/main/src/components/WhatsAppFloat.tsx): `src/components/WhatsAppFloat.tsx`

### Visual components

- [Puzzle motif](https://github.com/gswgaston/sitefabiana/blob/main/src/components/decorations/PuzzlePieces.tsx): `src/components/decorations/PuzzlePieces.tsx`
- [Brand doodles](https://github.com/gswgaston/sitefabiana/blob/main/src/components/decorations/BrandDoodles.tsx): `src/components/decorations/BrandDoodles.tsx`
- [Wave dividers](https://github.com/gswgaston/sitefabiana/blob/main/src/components/decorations/LayeredWaves.tsx): `src/components/decorations/LayeredWaves.tsx`
- [Puzzle border](https://github.com/gswgaston/sitefabiana/blob/main/src/components/decorations/CornerPuzzleBorder.tsx): `src/components/decorations/CornerPuzzleBorder.tsx`

### Other components

- **Site visitor**

## Connections

- Site visitor → React mount: opens
- React mount → Landing page: renders (evidence: `src/main.tsx`)
- Landing page → Navigation: renders (evidence: `src/App.tsx`)
- Landing page → Introduction: renders (evidence: `src/App.tsx`)
- Landing page → Credentials: renders (evidence: `src/App.tsx`)
- Landing page → Audience: renders (evidence: `src/App.tsx`)
- Landing page → Service stages: renders (evidence: `src/App.tsx`)
- Landing page → Practitioner profile: renders (evidence: `src/App.tsx`)
- Landing page → Care options: renders (evidence: `src/App.tsx`)
- Landing page → FAQs: renders (evidence: `src/App.tsx`)
- Landing page → Consultation prompt: renders (evidence: `src/App.tsx`)
- Landing page → Footer links: renders (evidence: `src/App.tsx`)
- Landing page → WhatsApp shortcut: renders (evidence: `src/App.tsx`)
- Introduction → Puzzle border: renders (evidence: `src/components/Hero.tsx`)
- Puzzle border → Puzzle motif: renders (evidence: `src/components/decorations/CornerPuzzleBorder.tsx`)
- Introduction → Wave dividers: renders (evidence: `src/components/Hero.tsx`)
- Introduction → Brand doodles: renders (evidence: `src/components/Hero.tsx`)
- Audience → Puzzle motif: renders (evidence: `src/components/Audience.tsx`)
- Audience → Brand doodles: renders (evidence: `src/components/Audience.tsx`)
- Audience → Wave dividers: renders (evidence: `src/components/Audience.tsx`)
- Service stages → Puzzle motif: renders (evidence: `src/components/Services.tsx`)
- Service stages → Brand doodles: renders (evidence: `src/components/Services.tsx`)
- Service stages → Wave dividers: renders (evidence: `src/components/Services.tsx`)
- Practitioner profile → Puzzle motif: renders (evidence: `src/components/About.tsx`)
- Practitioner profile → Brand doodles: renders (evidence: `src/components/About.tsx`)
- Care options → Puzzle motif: renders (evidence: `src/components/Locations.tsx`)
- Care options → Wave dividers: renders (evidence: `src/components/Locations.tsx`)
- FAQs → Puzzle motif: renders (evidence: `src/components/FAQ.tsx`)
- Consultation prompt → Wave dividers: renders (evidence: `src/components/ConversionBanner.tsx`)