# harris0519/cnc-automotives architecture

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

- Interactive diagram: https://gitdiagram.com/harris0519/cnc-automotives
- Repository: https://github.com/harris0519/cnc-automotives

## Overview

C&C 1023 Automotives is a React marketing website presenting premium vehicle and automotive services. A visitor explores the fleet, services, membership and customer stories, then can use the inquiry form to express interest; the README notes the form is front-end only and needs an external integration to send inquiries. The source is concentrated in one app file, so several distinct site areas share its path. The sampled excerpts do not establish form submission behavior or external service wiring.

Main entry points: [`src/App.jsx`](https://github.com/harris0519/cnc-automotives/blob/main/src/App.jsx) (Automotive website), [`src/main.jsx`](https://github.com/harris0519/cnc-automotives/blob/main/src/main.jsx) (React entry), [`src/index.css`](https://github.com/harris0519/cnc-automotives/blob/main/src/index.css) (Site styling)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_runtime["Website runtime"]
  node_entry["React entry<br/>[main.jsx]"]
  node_site["Automotive website<br/>[App.jsx]"]
  node_styling["Site styling<br/>[index.css]"]
end

subgraph group_offerings["Services and offers"]
  node_fleet["Vehicle fleet<br/>[App.jsx]"]
  node_services["Automotive services<br/>[App.jsx]"]
  node_membership["Membership plans<br/>[App.jsx]"]
end

subgraph group_engagement["Visitor engagement"]
  node_stories["Customer stories<br/>[App.jsx]"]
  node_inquiry["Inquiry form<br/>[App.jsx]"]
  node_video["Video presentation<br/>[App.jsx]"]
end

node_visitor(("Visitor"))

node_visitor -.->|"opens site"| node_entry
node_entry -->|"renders"| node_site
node_entry -->|"imports styles"| node_styling
node_site -->|"presents"| node_fleet
node_site -->|"presents"| node_services
node_site -->|"presents"| node_membership
node_site -->|"presents"| node_stories
node_site -->|"presents"| node_inquiry
node_site -->|"opens"| node_video
node_visitor -.->|"browses"| node_fleet
node_visitor -.->|"explores"| node_services
node_visitor -.->|"explores"| node_membership
node_visitor -.->|"reads"| node_stories
node_visitor -.->|"submits inquiry"| node_inquiry

click node_entry "https://github.com/harris0519/cnc-automotives/blob/main/src/main.jsx"
click node_site "https://github.com/harris0519/cnc-automotives/blob/main/src/App.jsx"
click node_styling "https://github.com/harris0519/cnc-automotives/blob/main/src/index.css"
click node_fleet "https://github.com/harris0519/cnc-automotives/blob/main/src/App.jsx"
click node_services "https://github.com/harris0519/cnc-automotives/blob/main/src/App.jsx"
click node_membership "https://github.com/harris0519/cnc-automotives/blob/main/src/App.jsx"
click node_stories "https://github.com/harris0519/cnc-automotives/blob/main/src/App.jsx"
click node_inquiry "https://github.com/harris0519/cnc-automotives/blob/main/src/App.jsx"
click node_video "https://github.com/harris0519/cnc-automotives/blob/main/src/App.jsx"

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_entry,node_site,node_styling toneBlue
class node_fleet,node_services,node_membership toneAmber
class node_stories,node_inquiry,node_video toneMint
class node_visitor toneIndigo
```

## Components

### Website runtime

- [React entry](https://github.com/harris0519/cnc-automotives/blob/main/src/main.jsx): `src/main.jsx`
- [Automotive website](https://github.com/harris0519/cnc-automotives/blob/main/src/App.jsx): `src/App.jsx`
- [Site styling](https://github.com/harris0519/cnc-automotives/blob/main/src/index.css): `src/index.css`

### Services and offers

- [Vehicle fleet](https://github.com/harris0519/cnc-automotives/blob/main/src/App.jsx): `src/App.jsx`
- [Automotive services](https://github.com/harris0519/cnc-automotives/blob/main/src/App.jsx): `src/App.jsx`
- [Membership plans](https://github.com/harris0519/cnc-automotives/blob/main/src/App.jsx): `src/App.jsx`

### Visitor engagement

- [Customer stories](https://github.com/harris0519/cnc-automotives/blob/main/src/App.jsx): `src/App.jsx`
- [Inquiry form](https://github.com/harris0519/cnc-automotives/blob/main/src/App.jsx): `src/App.jsx`
- [Video presentation](https://github.com/harris0519/cnc-automotives/blob/main/src/App.jsx): `src/App.jsx`

### Other components

- **Visitor**

## Connections

- Visitor → React entry: opens site
- React entry → Automotive website: renders (evidence: `src/main.jsx`)
- React entry → Site styling: imports styles (evidence: `src/main.jsx`)
- Automotive website → Vehicle fleet: presents (evidence: `src/App.jsx`)
- Automotive website → Automotive services: presents (evidence: `src/App.jsx`)
- Automotive website → Membership plans: presents (evidence: `src/App.jsx`)
- Automotive website → Customer stories: presents (evidence: `src/App.jsx`)
- Automotive website → Inquiry form: presents (evidence: `src/App.jsx`)
- Automotive website → Video presentation: opens (evidence: `src/App.jsx`)
- Visitor → Vehicle fleet: browses
- Visitor → Automotive services: explores
- Visitor → Membership plans: explores
- Visitor → Customer stories: reads
- Visitor → Inquiry form: submits inquiry