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 };
|