Customization

Palette and type

Every colour in both frontends comes from tokens in src/app/globals.css — --color-primary, --color-brand, --color-lime, --color-background and so on. Change those and every component follows. There are no raw palette utilities (bg-green-500) and no `dark:` variants anywhere; keep it that way and the theme stays coherent.

@theme {
  --color-primary: #0b6a5b;        /* leaf   — primary actions */
  --color-primary-hover: #084f45;
  --color-brand: #0d3d3b;          /* canopy — headings, prices */
  --color-brand-deep: #062826;     /* soil   — dark bands, footer */
  --color-lime: #c9f05a;           /* accent on dark surfaces */
  --color-background: #ffffff;     /* page — white, like the Figma */
  --color-muted: #f3f6f1;          /* tiles and insets */
  --color-border: #dbe3d9;
  --color-foreground: #1b2b28;     /* near-black with a green hint */
}

Fonts: Public Sans is self-hosted through next/font; TikTok Sans loads from the Google Fonts CSS API in the root layout. Swap either in layout.tsx and the @theme inline block.

Copy and static content

Navigation, FAQ, locale lists, delivery slots and payment methods are not API-managed — edit apps/web/src/data/content.ts. Legal documents live in src/data/legal.ts.

The catalogue

Manage products, categories, shops and the journal from the dashboard — images upload to your ImageKit or Cloudinary when you save. To start from an empty store instead of the demo, skip pnpm run seed; to put the demo back, run pnpm run seed -- --fresh.

Adding a dashboard screen

For a standard CRUD resource, do not create a page. Add a descriptor to apps/admin/src/data/resources.ts — columns, fields, endpoint — and app/(dashboard)/[screen] serves it live. Only screens needing bespoke behaviour (products, orders, users) get a directory, and a directory *shadows* the registry.

Adding an API resource

Copy the closest trio — brandModel.ts / brandController.ts / brandRoutes.ts — mount it in server.ts, and add a check to scripts/apiCheck.ts. Every write route chains protect, admin, preventReadOnlyActions.

UI primitives

components/ui/ is shadcn/ui. Anything the shadcn CLI generates drops straight in — replace its bg-background / text-foreground defaults with the Grovia tokens and keep the lowercase filename.