You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

17 lines
662 B

import React from "react";
import type { Promo } from "../types";
export function PromoGrid({ items, basePath = "" }: { items: Promo[]; basePath?: string }) {
return (
<div className="grid grid-cols-1 sm:grid-cols-3 gap-4">
{items.map((p) => (
<a key={p.id} href={p.href ? `${basePath}${p.href}` : "#"} className="group block rounded-lg overflow-hidden bg-white border border-gray-100 hover:shadow-md transition">
<img src={p.image} alt={p.title} className="w-full object-cover aspect-[4/3]" />
<div className="px-4 py-3 text-gray-800 group-hover:text-gray-900">{p.title}</div>
</a>
))}
</div>
);
}