83 lines
3.7 KiB
TypeScript
83 lines
3.7 KiB
TypeScript
import { Button } from "@/components/ui/button";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
const logos = [
|
|
{
|
|
src: "/block-media/shadcnblocks/block/logos/ph-daily.svg",
|
|
alt: "گزارش عملکرد",
|
|
},
|
|
{
|
|
src: "/block-media/shadcnblocks/block/logos/ph-weekly.svg",
|
|
alt: "داشبورد تحلیل داده",
|
|
},
|
|
{
|
|
src: "/block-media/shadcnblocks/block/logos/ph-kitty.svg",
|
|
alt: "نمودار شاخص کلیدی",
|
|
},
|
|
];
|
|
|
|
interface Feature161Props {
|
|
className?: string;
|
|
}
|
|
|
|
const Feature161 = ({ className }: Feature161Props) => {
|
|
return (
|
|
<section dir="rtl" lang="fa" className={cn("py-32", className)}>
|
|
<div className="container">
|
|
<div className="relative grid grid-cols-1 grid-rows-2 border border-muted-foreground/25 lg:grid-cols-2 lg:grid-rows-1">
|
|
<div className="absolute top-[-16px] start-[-1px] h-4 w-px bg-muted-foreground/25" />
|
|
<div className="absolute top-[-1px] start-[-16px] h-px w-4 bg-muted-foreground/25" />
|
|
<div className="absolute bottom-[-16px] start-[-1px] h-4 w-px bg-muted-foreground/25" />
|
|
<div className="absolute bottom-0 start-[-16px] h-px w-4 bg-muted-foreground/25" />
|
|
<div className="relative border-b border-muted-foreground/25 p-6 text-start md:p-16 lg:border-e lg:border-b-0">
|
|
<div className="absolute top-[-16px] end-[-1px] hidden h-4 w-px bg-muted-foreground/25 lg:block" />
|
|
<div className="absolute end-[-1px] bottom-[-16px] h-4 w-px bg-muted-foreground/25" />
|
|
<h1 className="text-xl font-bold text-balance">
|
|
داده پراکنده را به تصمیم تبدیل کنید
|
|
</h1>
|
|
<h3 className="mt-2 mb-6 text-xl text-pretty text-muted-foreground">
|
|
شاخصهای کلیدی را یکجا ببینید
|
|
</h3>
|
|
<div className="flex items-center gap-3">
|
|
<Button>شروع کنید</Button>
|
|
<Button variant="outline">تحلیل داده</Button>
|
|
</div>
|
|
</div>
|
|
<div className="grid grid-cols-1 grid-rows-7">
|
|
<div className="row-start-1 row-end-2 flex justify-evenly">
|
|
<div className="h-full w-px bg-muted-foreground/25" />
|
|
<div className="h-full w-px bg-muted-foreground/25" />
|
|
<div className="h-full w-px bg-muted-foreground/25" />
|
|
<div className="h-full w-px bg-muted-foreground/25" />
|
|
</div>
|
|
<div className="row-start-2 row-end-7 flex items-center justify-center gap-8 border-t border-b border-muted-foreground/25">
|
|
<div className="flex flex-col items-center gap-8 py-12 md:flex-row">
|
|
{logos.map((logo) => (
|
|
<img
|
|
key={logo.alt}
|
|
src={logo.src}
|
|
alt={logo.alt}
|
|
className="h-14 object-cover"
|
|
/>
|
|
))}
|
|
</div>
|
|
</div>
|
|
<div className="row-start-7 row-end-8 flex justify-evenly">
|
|
<div className="h-full w-px bg-muted-foreground/25" />
|
|
<div className="h-full w-px bg-muted-foreground/25" />
|
|
<div className="h-full w-px bg-muted-foreground/25" />
|
|
<div className="h-full w-px bg-muted-foreground/25" />
|
|
</div>
|
|
</div>
|
|
<div className="absolute top-[-16px] end-[-1px] h-4 w-px bg-muted-foreground/25" />
|
|
<div className="absolute top-[-1px] end-[-16px] h-px w-4 bg-muted-foreground/25" />
|
|
<div className="absolute end-[-1px] bottom-[-16px] h-4 w-px bg-muted-foreground/25" />
|
|
<div className="absolute end-[-16px] bottom-[-1px] h-px w-4 bg-muted-foreground/25" />
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Feature161 };
|