46 lines
1.1 KiB
TypeScript
46 lines
1.1 KiB
TypeScript
|
import Image from "next/image";
|
||
|
|
|
||
|
|
export const TestimonialCard = ({
|
||
|
|
id,
|
||
|
|
name,
|
||
|
|
title,
|
||
|
|
body,
|
||
|
|
img,
|
||
|
|
}: {
|
||
|
|
id: number;
|
||
|
|
name: string;
|
||
|
|
title: string;
|
||
|
|
img: string;
|
||
|
|
body: string;
|
||
|
|
}) => {
|
||
|
|
return (
|
||
|
|
<div
|
||
|
|
key={id}
|
||
|
|
className={`group mx-auto w-[360px] max-w-[380px] rounded-xl border border-gray-300 bg-white p-6 transition-all duration-500`}
|
||
|
|
>
|
||
|
|
<div className={`flex items-center gap-5 pb-4`}>
|
||
|
|
<Image
|
||
|
|
width={64}
|
||
|
|
height={64}
|
||
|
|
className="h-16 w-16 rounded-full object-contain"
|
||
|
|
src={img}
|
||
|
|
alt="avatar"
|
||
|
|
/>
|
||
|
|
<div className="block">
|
||
|
|
<p className="font-switer font-medium text-black transition-all duration-500">
|
||
|
|
{name}
|
||
|
|
</p>
|
||
|
|
<span className="font-mium-reg text-gray text-sm tracking-[-0.8px]">
|
||
|
|
{title}
|
||
|
|
</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div className="border-t border-solid border-gray-200 pt-4">
|
||
|
|
<p className="text-b-4-14 text-gray font-mium-reg line-clamp-4 leading-5 font-normal tracking-[-0.6px]">
|
||
|
|
{body}
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
};
|