40 lines
981 B
TypeScript
40 lines
981 B
TypeScript
import { ReactNode } from "react";
|
|
|
|
interface IconBoxProps {
|
|
icon: ReactNode;
|
|
title: string;
|
|
description: string;
|
|
hasBorder?: boolean;
|
|
}
|
|
|
|
export function IconBox({ icon, title, description, hasBorder = true }: IconBoxProps) {
|
|
return (
|
|
<div className="flex flex-col items-start gap-[20px] sm:flex-row sm:gap-[40px]">
|
|
<div className="flex h-[88px] w-[88px] shrink-0 items-center justify-center">
|
|
{icon}
|
|
</div>
|
|
|
|
<div
|
|
className={`flex-1 pb-[30px] pt-[5px] ${
|
|
hasBorder ? "border-b border-[#3F3F3F]" : ""
|
|
}`}
|
|
>
|
|
<h5
|
|
className="mb-[15px] text-white"
|
|
style={{
|
|
fontFamily: "var(--font-manrope)",
|
|
fontSize: "25px",
|
|
lineHeight: 1.4,
|
|
fontWeight: 500,
|
|
}}
|
|
>
|
|
{title}
|
|
</h5>
|
|
<p className="text-[16px] leading-[1.6] text-[#87899B]">
|
|
{description}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|