129 lines
3.4 KiB
TypeScript
129 lines
3.4 KiB
TypeScript
|
import { cn } from "@/lib/utils";
|
|||
|
|
|
|||
|
|
const items = [
|
|||
|
|
{
|
|||
|
|
title: "Next.js",
|
|||
|
|
image: (
|
|||
|
|
<img
|
|||
|
|
src="/block-media/shadcnblocks/block/logos/nextjs-wordmark.svg"
|
|||
|
|
alt="گزارش مالی یکپارچه"
|
|||
|
|
className="mt-2.5 max-h-12 lg:mt-0 dark:invert"
|
|||
|
|
/>
|
|||
|
|
),
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: "React",
|
|||
|
|
image: (
|
|||
|
|
<img
|
|||
|
|
src="/block-media/shadcnblocks/block/logos/react-wordmark.svg"
|
|||
|
|
alt="داشبورد ERP"
|
|||
|
|
className="mt-2.5 max-h-9 lg:mt-0 lg:max-h-12"
|
|||
|
|
/>
|
|||
|
|
),
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: "Shadcn/ui",
|
|||
|
|
image: (
|
|||
|
|
<img
|
|||
|
|
src="/block-media/shadcnblocks/block/logos/shadcn-ui-wordmark.svg"
|
|||
|
|
alt="مدیریت عملیات"
|
|||
|
|
className="mt-2.5 max-h-5 lg:mt-0 lg:max-h-7 dark:invert"
|
|||
|
|
/>
|
|||
|
|
),
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: "Supabase",
|
|||
|
|
image: (
|
|||
|
|
<>
|
|||
|
|
<img
|
|||
|
|
src="/block-media/shadcnblocks/block/logos/supabase-wordmark.svg"
|
|||
|
|
alt="گزارش مالی یکپارچه"
|
|||
|
|
className="mt-2.5 max-h-6 lg:mt-0 lg:max-h-9 dark:hidden"
|
|||
|
|
/>
|
|||
|
|
<img
|
|||
|
|
src="/block-media/shadcnblocks/block/logos/supabase-wordmark-dark.svg"
|
|||
|
|
alt="داشبورد ERP"
|
|||
|
|
className="mt-2.5 hidden max-h-6 lg:mt-0 lg:max-h-9 dark:block"
|
|||
|
|
/>
|
|||
|
|
</>
|
|||
|
|
),
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: "Vercel",
|
|||
|
|
image: (
|
|||
|
|
<img
|
|||
|
|
src="/block-media/shadcnblocks/block/logos/vercel-wordmark.svg"
|
|||
|
|
className="mt-2.5 max-h-5 lg:mt-0 lg:max-h-8 dark:invert"
|
|||
|
|
alt="مدیریت عملیات"
|
|||
|
|
/>
|
|||
|
|
),
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: "Tailwind",
|
|||
|
|
image: (
|
|||
|
|
<>
|
|||
|
|
<img
|
|||
|
|
src="/block-media/shadcnblocks/block/logos/tailwind-wordmark-light.svg"
|
|||
|
|
alt="گزارش مالی یکپارچه"
|
|||
|
|
className="mt-2.5 max-h-5 lg:mt-0 lg:max-h-6 dark:hidden"
|
|||
|
|
/>
|
|||
|
|
<img
|
|||
|
|
src="/block-media/shadcnblocks/block/logos/tailwind-wordmark-dark.svg"
|
|||
|
|
alt="داشبورد ERP"
|
|||
|
|
className="mt-2.5 hidden max-h-5 lg:mt-0 lg:max-h-6 dark:block"
|
|||
|
|
/>
|
|||
|
|
</>
|
|||
|
|
),
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: "Astro",
|
|||
|
|
image: (
|
|||
|
|
<img
|
|||
|
|
src="/block-media/shadcnblocks/block/logos/astro-wordmark.svg"
|
|||
|
|
alt="مدیریت عملیات"
|
|||
|
|
className="mt-2.5 max-h-7 lg:mt-0 lg:max-h-9 dark:invert"
|
|||
|
|
/>
|
|||
|
|
),
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: "GitHub",
|
|||
|
|
image: (
|
|||
|
|
<img
|
|||
|
|
src="/block-media/shadcnblocks/block/logos/github-wordmark.svg"
|
|||
|
|
alt="گزارش مالی یکپارچه"
|
|||
|
|
className="mt-2.5 max-h-6 lg:mt-0 lg:max-h-9 dark:invert"
|
|||
|
|
/>
|
|||
|
|
),
|
|||
|
|
},
|
|||
|
|
];
|
|||
|
|
|
|||
|
|
interface Feature53Props {
|
|||
|
|
className?: string;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const Feature53 = ({ className }: Feature53Props) => {
|
|||
|
|
return (
|
|||
|
|
<section dir="rtl" lang="fa" className={cn("py-32", className)}>
|
|||
|
|
<div className="container">
|
|||
|
|
<div className="grid grid-cols-2 gap-px border border-border bg-border md:grid-cols-4">
|
|||
|
|
{items.map((item, index) => (
|
|||
|
|
<div key={index} className="bg-background">
|
|||
|
|
<div className="relative mx-4 flex min-h-[150px] flex-col items-center justify-center lg:min-h-[280px]">
|
|||
|
|
<p className="absolute top-4 inset-s-0 font-mono text-xs">
|
|||
|
|
<span>
|
|||
|
|
{(index + 1).toLocaleString("fa-IR").padStart(2, "۰")}
|
|||
|
|
</span>
|
|||
|
|
<span className="ms-2">{item.title}</span>
|
|||
|
|
</p>
|
|||
|
|
{item.image}
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
))}
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</section>
|
|||
|
|
);
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
export { Feature53 };
|