Internal Reference

GreenFoodCore

Modular front-end component system for the Green Food Group web ecosystem.

This page is for internal reference only. robots: noindex is set. Do not link to this page from live sites.

Registry

Component Register

Component	Folder	Status	Used on	Notes
Header	`components/header/`	Done	All sites	Mobile hamburger, sticky, scroll shadow
Footer	`components/footer/`	Done	All sites	4-column, dark background
WhatsApp Widget	`components/whatsapp/`	Done	All sites	Floating, configurable via data attributes
Contact Form	`components/forms/`	Done	GFC, Academy	PHP mailer, validation, honeypot
Cards	`components/cards/`	Done	GFC, Academy	Service, school, stat, featured variants
Buttons	`components/buttons/`	Done	All sites	Primary, secondary, ghost, dark, sm/lg
Nav / Breadcrumb	`components/nav/`	Done	Portal	Auto-built from page sections
Search	`pages/search/`	Planned	Portal	—
Business Directory	`pages/directory/`	Planned	Portal	—
Knowledge Repository	`pages/knowledge/`	Planned	Portal	—

Design Tokens

Colour Palette

Token	Value	Role
`--color-primary`	#1A3C2B	Deep Forest Green — main brand colour
`--color-accent`	#C8720A	Saffron — CTAs, highlights, active states
`--color-off-white`	#F8F6F2	Warm parchment — page background
`--color-near-black`	#1E1E1A	Base text

Design Tokens

Typography

Eyebrow Label

Heading One — Cormorant Garamond

Heading Two — Editorial Weight

Heading Three — Section Title

Heading Four — Sub-section

Lead paragraph — DM Sans, slightly larger, used below headings.

Body paragraph — DM Sans Regular. India's food ecosystem requires standards built on clarity and practice. Our consultancy bridges regulatory intent with operational reality.

Food safety is not a compliance exercise — it is a cultural commitment. Green Food Consultancy

Components

Buttons

Primary Secondary Ghost Small Large

Dark Variant

Components

Cards

Service Card

Standard card with icon, heading, body text, and ghost CTA link.

Learn more

Featured Card

Highlighted variant with accent border. Use for recommended or primary services.

Learn more

500+ Professionals Trained

Reference

File Map

greenfoodcore/
├── index.html                ← this file
├── assets/
│   ├── css/
│   │   ├── variables.css     ← ALL design tokens (edit here first)
│   │   ├── global.css        ← reset + layout utilities
│   │   └── typography.css    ← type scale
│   ├── js/
│   │   ├── utils.js          ← GFC helper functions (window.GFC)
│   │   └── loader.js         ← component injection engine
│   ├── images/               ← logo.svg, favicons
│   └── fonts/                ← local font fallbacks (optional)
├── components/
│   ├── header/               ← header.html · header.css · header.js
│   ├── footer/               ← footer.html · footer.css · footer.js
│   ├── nav/                  ← nav.html · nav.css · nav.js
│   ├── whatsapp/             ← whatsapp.html · whatsapp.css · whatsapp.js
│   ├── forms/                ← contact.html · forms.css · submission.php
│   ├── cards/                ← card.css
│   └── buttons/              ← buttons.css
├── pages/
│   ├── directory/            ← [planned] Business Directory
│   ├── knowledge/            ← [planned] Knowledge Repository
│   └── search/               ← [planned] Search
└── docs/
    ├── decisions.md
    ├── component-register.md
    └── changelog.md

GreenFoodCore · Internal use only · Not indexed · Green Food Consultancy, Paschim Vihar, New Delhi