76 lines
2.3 KiB
TypeScript
76 lines
2.3 KiB
TypeScript
import { cn } from "@/lib/utils";
|
|
|
|
const features = [
|
|
{
|
|
reversed: false,
|
|
title: "تقویم تیمی",
|
|
description:
|
|
"برنامه تیم را هماهنگ کنید و تداخل وظایف را کاهش دهید.",
|
|
imageAlt: "تقویم تیم",
|
|
},
|
|
{
|
|
reversed: true,
|
|
title: "اشتراک فایل",
|
|
description:
|
|
"نسخه درست فایل همیشه در دسترس همه اعضا باشد.",
|
|
imageAlt: "فضای همکاری تیمی",
|
|
},
|
|
{
|
|
reversed: false,
|
|
title: "منشن و بحث",
|
|
description:
|
|
"بحث را کنار هر تسک نگه دارید تا تصمیمها گم نشود.",
|
|
imageAlt: "برد مدیریت پروژه",
|
|
},
|
|
];
|
|
|
|
interface Feature62Props {
|
|
className?: string;
|
|
}
|
|
|
|
const Feature62 = ({ className }: Feature62Props) => {
|
|
return (
|
|
<section dir="rtl" lang="fa" className={cn("py-32", className)}>
|
|
<div className="container">
|
|
<div className="flex flex-col space-y-10 md:space-y-16">
|
|
{features.map((feature) => (
|
|
<div
|
|
key={feature.title}
|
|
className={cn("lg:flex lg:gap-x-4", feature.reversed && "flex-row-reverse")}
|
|
>
|
|
<div className="lg:w-1/2">
|
|
<div className="mb-6 md:mb-8 lg:mb-0">
|
|
<img
|
|
src="/block-media/shadcnblocks/block/placeholder-1.svg"
|
|
alt={feature.imageAlt}
|
|
className="aspect-4/3 w-full rounded-md border border-border object-cover"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div
|
|
className={cn(
|
|
"lg:flex lg:w-1/2 lg:items-center",
|
|
feature.reversed
|
|
? "lg:pe-24 2xl:pe-32"
|
|
: "lg:ps-24 2xl:ps-32",
|
|
)}
|
|
>
|
|
<div className="lg:text-start">
|
|
<h3 className="mb-3 text-xl font-semibold md:mb-4 md:text-xl lg:mb-6">
|
|
{feature.title}
|
|
</h3>
|
|
<p className="text-muted-foreground lg:text-lg">
|
|
{feature.description}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Feature62 };
|