55 lines
2.7 KiB
Markdown
55 lines
2.7 KiB
Markdown
# Mozimo — The Art of Chocolate, Made in India
|
|
|
|
A full luxury-editorial redesign of [mozimo.in](https://mozimo.in), implementing the
|
|
proposed "Enter the world of Mozimo" flow: ivory, deep cacao, champagne gold,
|
|
restrained puce — editorial, European, slightly mysterious.
|
|
|
|
Built with **TanStack Start (React 19 + Vite)**, **Tailwind CSS 4**, and zero animation
|
|
dependencies (hand-rolled CSS + IntersectionObserver).
|
|
|
|
## Design language
|
|
|
|
- **Palette** — ivory `#faf6ee`, deep cacao `#140a06`, champagne gold `#c2a06e`, brand puce `#703133`
|
|
- **Type** — Fraunces (display serif), Renner* (brand geometric sans), Samantha Signature (script accents)
|
|
- **Motifs** — arched image masks, paper-grain texture, champagne hairlines, marquee tickers, cursor-trailing index previews, staggered line reveals
|
|
|
|
## Site map
|
|
|
|
| Route | Contents |
|
|
|---|---|
|
|
| `/` | Announcement bar → hero ("Chocolate, perfected.") → brand statement → Shop by Experience → The Mozimo Edit → Signatures → Made by Hand (film) → Ingredient Story → The Art of Giving → Seasonal Edit → Experiences → Journal → Press → Instagram |
|
|
| `/chocolate` | Collection index (Bars → Gifting) with hover previews + The Pantry |
|
|
| `/gifting` | The Art of Giving — categories, hampers, Seasonal Edit |
|
|
| `/experiences` | Chef's Table, Tastings, Private Events, Collaborations, Pop-ups, Mozimo at Home |
|
|
| `/bespoke` | Made for Your Moment — corporate, weddings, collaborations, events, custom packaging |
|
|
| `/our-world` | Story · Chocolate · Craft · Ingredients · People (+ `/about` redirects here) |
|
|
| `/journal` (+3 essays) | The Mozimo Journal — The Art of Tempering; Why Dark Chocolate Tastes Different; The Story Behind Our Signature Box |
|
|
|
|
Commerce stays on [shop.mozimo.in](https://shop.mozimo.in/) — product cards, bag and
|
|
collection links point there. All product photography is self-hosted under
|
|
`public/products/` (fetched from the brand CDN via `scripts/fetch-assets.py`).
|
|
|
|
## Develop
|
|
|
|
```bash
|
|
npm run dev # vite dev server (port 3000)
|
|
npm run build # production build to dist/
|
|
npm start # serve the production build (node server.mjs)
|
|
npm run preview # serve the production build via vite preview
|
|
npm run lint # eslint
|
|
```
|
|
|
|
## Docker
|
|
|
|
```bash
|
|
docker build -t mozimo-web .
|
|
docker run -p 3000:3000 mozimo-web
|
|
```
|
|
|
|
Three-stage build (`deps → builder → runner`) on pinned `node:24-trixie-slim`:
|
|
dependencies install with `npm ci` and BuildKit cache mounts, the final image
|
|
runs as the unprivileged `node` user, ships only production dependencies plus
|
|
the build output and a small Node server (`server.mjs`: static assets with
|
|
immutable caching + gzip, SSR fetch-handler fallback, graceful shutdown), and
|
|
includes a `HEALTHCHECK`. `.dockerignore` keeps build context minimal.
|