MohFarawati
f7355b5356
Redesign the portfolio list/category grid into a premium, image-first gallery (Phase 3), applying the warm-premium tokens. - Add components/site/portfolio-cover.tsx: renders the stored cover image (next/image, object-cover, hover zoom) or a restrained branded placeholder (monogram + category) when none is set. Placeholders are temporary — the owner will swap in real artwork. - Rewrite portfolio-project-grid: responsive 1/2/3-col gallery, featured projects span two columns with a larger cover, cards use the type scale (text-h2/h3/caption), eyebrow category labels, line-clamped summaries, soft elevation and hover lift. Directly fixes the "portfolio shows no images" gap on the list and category pages. Verified: eslint clean, no new type errors, tailwind generates the utilities.
This is a Next.js project bootstrapped with create-next-app.
Getting Started
First, run the development server:
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev
Open http://localhost:3014 with your browser to see the result.
You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.
This project uses next/font/local to load local font assets from app/fonts without relying on external font providers.
Learn More
To learn more about Next.js, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
You can check out the Next.js GitHub repository - your feedback and contributions are welcome!
Deploy on Vercel
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out our Next.js deployment documentation for more details.
Infrastructure Basics
- Copy environment variables:
cp .env.example .env
- Start containers:
make start
make port
- Initialize database:
make db-init
- Run quality checks:
npm run lint
npm run build
- Health check:
make health