- Add all shadcn/ui components (button, card, form, dialog, navigation-menu, etc.) - Create main layout with navigation header and footer - Implement homepage with hero, showreel, featured projects, and capabilities - Build about page with studio origins, values, and capabilities - Create services page with detailed service offerings - Implement portfolio page with masonry grid for varying aspect ratios - Build contact page with 4-step multistep form - Add project and service data structures with placeholder content - Configure SEO metadata, canonical links, and JSON-LD schema - Add font preloading and image lazy-loading for performance - Configure Next.js Image for Unsplash remote patterns - Fix Navigation component to use modern Link pattern (remove legacyBehavior) - Add comprehensive README with project documentation
22 lines
507 B
TypeScript
22 lines
507 B
TypeScript
"use client";
|
|
|
|
import { ProjectCard } from "@/components/ProjectCard";
|
|
import type { Project } from "@/data/projects";
|
|
|
|
interface MasonryGridProps {
|
|
projects: Project[];
|
|
}
|
|
|
|
export function MasonryGrid({ projects }: MasonryGridProps) {
|
|
return (
|
|
<div className="columns-1 gap-6 space-y-6 sm:columns-2 lg:columns-3">
|
|
{projects.map((project) => (
|
|
<div key={project.id} className="break-inside-avoid">
|
|
<ProjectCard project={project} />
|
|
</div>
|
|
))}
|
|
</div>
|
|
);
|
|
}
|
|
|