87 lines
3.7 KiB
TypeScript
87 lines
3.7 KiB
TypeScript
import React from "react";
|
||
|
||
import { cn } from "@/lib/utils";
|
||
|
||
interface Projects13Props {
|
||
className?: string;
|
||
}
|
||
|
||
const persianIndices = ["۱", "۲", "۰۳", "۰۴"];
|
||
|
||
const Projects13 = ({ className }: Projects13Props) => {
|
||
const projects = [
|
||
{
|
||
id: 1,
|
||
title: "پلتفرم فروشگاه آنلاین",
|
||
description:
|
||
"پلتفرمی کاملاً مقیاسپذیر برای فروش آنلاین از صفر طراحی و توسعه داده شد؛ با تمرکز بر سادگی و عملکرد، گردش کار بیش از ۱۰٬۰۰۰ کاربر در صنایع مختلف را متحول کرد.",
|
||
launchDate: "۲۸ فروردین ۱۴۰۴",
|
||
image: "/block-media/shadcnblocks/block/guri4/img1.png",
|
||
},
|
||
{
|
||
id: 2,
|
||
title: "اپلیکیشن بانکداری موبایل",
|
||
description:
|
||
"اپلیکیشن بانکداری موبایل امن و کاربرپسند با پردازش لحظهای تراکنش، احراز هویت بیومتریک و تجربهای روان برای مؤسسات مالی ساخته شد.",
|
||
launchDate: "۲۵ اسفند ۱۴۰۳",
|
||
image: "/block-media/shadcnblocks/block/guri4/img2.png",
|
||
},
|
||
{
|
||
id: 3,
|
||
title: "تولیدکننده محتوای هوش مصنوعی",
|
||
description:
|
||
"پلتفرمی مبتنی بر هوش مصنوعی برای تولید محتوای جذاب بازاریابی، با قابلیتهای پیشرفته پردازش زبان طبیعی و قالبهای قابل تنظیم توسعه یافت.",
|
||
launchDate: "۹ اسفند ۱۴۰۳",
|
||
image: "/block-media/shadcnblocks/block/guri4/img3.png",
|
||
},
|
||
{
|
||
id: 4,
|
||
title: "ابزار مدیریت پروژه",
|
||
description:
|
||
"راهکار پیادهسازی جامع مدیریت پروژه با همکاری بلادرنگ، پیگیری وظایف و داشبورد تحلیلی برای تیمهای دورکار و سازمانها ایجاد شد.",
|
||
launchDate: "۳۰ دی ۱۴۰۳",
|
||
image: "/block-media/shadcnblocks/block/guri4/img10.png",
|
||
},
|
||
];
|
||
|
||
return (
|
||
<section dir="rtl" lang="fa" className={cn("py-32", className)}>
|
||
<div className="container">
|
||
<ul className="relative w-full">
|
||
<li className="hidden justify-between gap-10 border-b pt-15 pb-2 text-sm tracking-tight text-foreground/40 lg:flex lg:text-base">
|
||
<p className="w-1/4 text-start">پروژهها</p>
|
||
<p className="w-2/4 text-start">توضیحات</p>
|
||
<p className="w-1/4 text-start">گالری</p>
|
||
</li>
|
||
{projects.map((project, index) => (
|
||
<li
|
||
key={project.id}
|
||
className="flex w-full flex-col justify-between gap-10 border-b py-10 text-start lg:flex-row lg:py-15"
|
||
>
|
||
<div className="flex gap-4 text-xl font-medium tracking-tighter lg:w-1/4">
|
||
<p>{persianIndices[index]}</p>
|
||
<div className="flex flex-col gap-1">
|
||
<p>{project.title}</p>
|
||
<p className="text-muted-foreground">({project.launchDate})</p>
|
||
</div>
|
||
</div>
|
||
<div className="text-2xl leading-relaxed lg:w-2/4 lg:text-3xl">
|
||
{project.description}
|
||
</div>
|
||
<div className="w-full text-sm text-foreground/50 lg:h-30 lg:w-1/4 lg:ps-20 lg:text-base">
|
||
<img
|
||
src={project.image}
|
||
alt={project.title}
|
||
className="h-full w-full object-cover"
|
||
/>
|
||
</div>
|
||
</li>
|
||
))}
|
||
</ul>
|
||
</div>
|
||
</section>
|
||
);
|
||
};
|
||
|
||
export { Projects13 };
|