# shindami/normas-pancit-luglog architecture

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

- Interactive diagram: https://gitdiagram.com/shindami/normas-pancit-luglog
- Repository: https://github.com/shindami/normas-pancit-luglog

## Overview

Normas Special is a restaurant storefront for discovering its Filipino Pancit Lug-log, learning the restaurant’s story, viewing customer reviews, and finding ways to order. The principal visitor journey starts at the landing hero, moves through the story, differentiators, menu, and reviews, then reaches ordering and contact information. The menu carousel and its item cards provide one internal presentation layer. The README is generic Next.js setup guidance; the architecture here follows the product description and sampled page composition. Other components in the tree are not shown as active features unless the sampled page wires them in.

Main entry points: [`app/page.tsx`](https://github.com/shindami/normas-pancit-luglog/blob/develop/app/page.tsx) (Home page), [`components/pages/HowToOrderSection/index.tsx`](https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/HowToOrderSection/index.tsx) (Order information), [`components/pages/HeroSection/index.tsx`](https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/HeroSection/index.tsx) (Hero section), [`components/pages/MenuSection/index.tsx`](https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/MenuSection/index.tsx) (Menu section)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_landing["Landing and Story"]
  node_page["Home page<br/>[page.tsx]"]
  node_hero["Hero section<br/>[index.tsx]"]
  node_story["Restaurant story<br/>[index.tsx]"]
  node_why["Why Normas"]
end

subgraph group_discovery["Menu Discovery"]
  node_menu["Menu section<br/>[index.tsx]"]
  node_menuitems["Menu item cards<br/>[index.tsx]"]
  node_carousel["Carousel wrapper<br/>[index.tsx]"]
  node_embla["Carousel controls<br/>[carousel.tsx]"]
end

subgraph group_reputation["Customer Trust"]
  node_reviews["Review section<br/>[index.tsx]"]
  node_reviewcards["Review cards<br/>[index.tsx]"]
end

subgraph group_ordering["Ordering and Contact"]
  node_order["Order information<br/>[index.tsx]"]
  node_options["Order options<br/>[index.tsx]"]
  node_footer["Contact and footer<br/>[index.tsx]"]
end

node_visitor(("Restaurant visitor"))

node_visitor -->|"opens"| node_page
node_page -->|"renders"| node_hero
node_page -->|"renders"| node_story
node_page -->|"renders"| node_why
node_page -->|"renders"| node_menu
node_page -->|"renders"| node_reviews
node_page -->|"renders"| node_order
node_page -->|"renders"| node_footer
node_hero -->|"scrolls to"| node_story
node_hero -->|"scrolls to"| node_order
node_menu -->|"renders"| node_carousel
node_menu -->|"creates cards"| node_menuitems
node_carousel -->|"uses controls"| node_embla
node_menuitems -->|"scrolls to"| node_order
node_reviews -->|"renders"| node_reviewcards
node_order -->|"renders"| node_options
node_footer -->|"scrolls to"| node_story
node_footer -->|"scrolls to"| node_order

click node_page "https://github.com/shindami/normas-pancit-luglog/blob/develop/app/page.tsx"
click node_hero "https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/HeroSection/index.tsx"
click node_story "https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/StorySection/index.tsx"
click node_why "https://github.com/shindami/normas-pancit-luglog/tree/develop/components/pages/WhyNormas"
click node_menu "https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/MenuSection/index.tsx"
click node_menuitems "https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/MenuItem/index.tsx"
click node_carousel "https://github.com/shindami/normas-pancit-luglog/blob/develop/components/ui/carousel/index.tsx"
click node_embla "https://github.com/shindami/normas-pancit-luglog/blob/develop/components/ui/carousel/carousel.tsx"
click node_reviews "https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/ReviewSection/index.tsx"
click node_reviewcards "https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/ReviewsCard/index.tsx"
click node_order "https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/HowToOrderSection/index.tsx"
click node_options "https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/OrderOption/index.tsx"
click node_footer "https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/Footer/index.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_page,node_hero,node_story,node_why toneBlue
class node_menu,node_menuitems,node_carousel,node_embla toneAmber
class node_reviews,node_reviewcards toneMint
class node_order,node_options,node_footer toneRose
class node_visitor toneIndigo
```

## Components

### Landing and Story

- [Home page](https://github.com/shindami/normas-pancit-luglog/blob/develop/app/page.tsx): `app/page.tsx`
- [Hero section](https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/HeroSection/index.tsx): `components/pages/HeroSection/index.tsx`
- [Restaurant story](https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/StorySection/index.tsx): `components/pages/StorySection/index.tsx`
- [Why Normas](https://github.com/shindami/normas-pancit-luglog/tree/develop/components/pages/WhyNormas): `components/pages/WhyNormas`

### Menu Discovery

- [Menu section](https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/MenuSection/index.tsx): `components/pages/MenuSection/index.tsx`
- [Menu item cards](https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/MenuItem/index.tsx): `components/pages/MenuItem/index.tsx`
- [Carousel wrapper](https://github.com/shindami/normas-pancit-luglog/blob/develop/components/ui/carousel/index.tsx): `components/ui/carousel/index.tsx`
- [Carousel controls](https://github.com/shindami/normas-pancit-luglog/blob/develop/components/ui/carousel/carousel.tsx): `components/ui/carousel/carousel.tsx`

### Customer Trust

- [Review section](https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/ReviewSection/index.tsx): `components/pages/ReviewSection/index.tsx`
- [Review cards](https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/ReviewsCard/index.tsx): `components/pages/ReviewsCard/index.tsx`

### Ordering and Contact

- [Order information](https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/HowToOrderSection/index.tsx): `components/pages/HowToOrderSection/index.tsx`
- [Order options](https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/OrderOption/index.tsx): `components/pages/OrderOption/index.tsx`
- [Contact and footer](https://github.com/shindami/normas-pancit-luglog/blob/develop/components/pages/Footer/index.tsx): `components/pages/Footer/index.tsx`

### Other components

- **Restaurant visitor**

## Connections

- Restaurant visitor → Home page: opens
- Home page → Hero section: renders
- Home page → Restaurant story: renders
- Home page → Why Normas: renders
- Home page → Menu section: renders
- Home page → Review section: renders
- Home page → Order information: renders
- Home page → Contact and footer: renders
- Hero section → Restaurant story: scrolls to
- Hero section → Order information: scrolls to
- Menu section → Carousel wrapper: renders
- Menu section → Menu item cards: creates cards
- Carousel wrapper → Carousel controls: uses controls
- Menu item cards → Order information: scrolls to
- Review section → Review cards: renders
- Order information → Order options: renders
- Contact and footer → Restaurant story: scrolls to
- Contact and footer → Order information: scrolls to