some edit
This commit is contained in:
+50
-34
@@ -7,45 +7,53 @@ import { cn } from "@/lib/utils";
|
||||
|
||||
const Feature239 = () => {
|
||||
return (
|
||||
<section dir="rtl" lang="fa" className="bg-background py-32">
|
||||
<div className="relative container flex flex-col items-center px-0! lg:pt-8">
|
||||
<DottedDiv>
|
||||
<div className="grid lg:grid-cols-2">
|
||||
<div className="flex w-full flex-col gap-8 px-10 py-20 text-start md:px-14">
|
||||
<section
|
||||
dir="rtl"
|
||||
lang="fa"
|
||||
className="w-full min-w-0 overflow-x-hidden bg-background py-12 sm:py-20 lg:py-32"
|
||||
>
|
||||
<div className="relative container flex min-w-0 flex-col items-center px-4 sm:px-6 lg:px-8 lg:pt-8">
|
||||
<DottedDiv className="w-full min-w-0">
|
||||
<div className="grid min-w-0 lg:grid-cols-2">
|
||||
<div className="flex w-full min-w-0 flex-col gap-6 px-2 py-10 text-start sm:gap-8 sm:px-6 sm:py-14 md:px-10 md:py-20 lg:px-14">
|
||||
<Badge
|
||||
variant="outline"
|
||||
className="flex w-fit cursor-pointer items-center gap-4 rounded-full px-6 py-2 transition-all ease-in-out hover:gap-6"
|
||||
className="flex h-auto w-full max-w-full cursor-pointer items-start gap-3 rounded-full px-4 py-3 whitespace-normal transition-all ease-in-out hover:gap-4 sm:w-fit sm:items-center sm:px-6 sm:py-2"
|
||||
>
|
||||
<span className="text-sm font-medium tracking-tight text-muted-foreground">
|
||||
قوانین ساده تعریف کنید تا وظایف تکراری بدون دخالت دست انجام شود. تیم روی تصمیم‌های مهم تمرکز می‌کند و سرعت اجرا بالاتر می‌رود.
|
||||
<span className="min-w-0 text-sm font-medium tracking-tight text-pretty text-muted-foreground">
|
||||
قوانین ساده تعریف کنید تا وظایف تکراری بدون دخالت دست انجام
|
||||
شود. تیم روی تصمیم‌های مهم تمرکز می‌کند و سرعت اجرا بالاتر
|
||||
می‌رود.
|
||||
</span>
|
||||
<ChevronRight className="size-4! rtl:rotate-180" />
|
||||
<ChevronRight className="size-4 shrink-0 rtl:rotate-180" />
|
||||
</Badge>
|
||||
<h1 className="text-2xll font-semibold tracking-tighter text-balance md:text-2xll">
|
||||
<h1 className="text-2xl font-semibold tracking-tighter text-balance text-foreground sm:text-3xl md:text-2xll">
|
||||
فرایندها را استاندارد و سریع کنید
|
||||
<br />
|
||||
اتوماسیون را در کل سازمان یکپارچه کنید
|
||||
<br />
|
||||
خطای انسانی را در کارهای روزمره کم کنید
|
||||
</h1>
|
||||
<p className="tracking-tight text-pretty text-muted-foreground md:text-xl">
|
||||
فرایندهای بین‌تیمی را در یک بوم بصری طراحی کنید. هر مرحله قابل ردیابی است و گلوگاه‌ها قبل از تأخیر جدی مشخص می‌شوند.
|
||||
<p className="tracking-tight text-pretty text-muted-foreground sm:text-lg md:text-xl">
|
||||
فرایندهای بین‌تیمی را در یک بوم بصری طراحی کنید. هر مرحله قابل
|
||||
ردیابی است و گلوگاه‌ها قبل از تأخیر جدی مشخص می‌شوند.
|
||||
</p>
|
||||
<div className="flex w-full gap-2">
|
||||
<Button className="text-md h-12 w-fit rounded-full bg-primary px-10 text-primary-foreground">
|
||||
<div className="flex w-full flex-wrap gap-2">
|
||||
<Button className="text-md h-12 w-fit rounded-full bg-primary px-8 text-primary-foreground sm:px-10">
|
||||
شروع کنید
|
||||
</Button>
|
||||
<Button
|
||||
variant="outline"
|
||||
className="text-md h-12 w-12 rounded-full transition-all ease-in-out hover:rotate-45"
|
||||
className="text-md h-12 w-12 shrink-0 rounded-full transition-all ease-in-out hover:rotate-45"
|
||||
>
|
||||
<ArrowUpRight className="rtl:rotate-180" />
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
<DottedDiv className="group size-full place-self-end p-4 lg:w-4/6">
|
||||
<div className="relative size-full bg-muted/50 p-4 transition-all ease-in-out group-hover:bg-muted">
|
||||
<div className="relative size-full overflow-hidden rounded-3xl">
|
||||
|
||||
<DottedDiv className="group min-w-0 place-self-end p-2 sm:p-4 lg:w-4/6">
|
||||
<div className="relative min-h-80 w-full bg-muted/50 p-3 transition-all ease-in-out group-hover:bg-muted sm:min-h-96 sm:p-4">
|
||||
<div className="relative size-full min-h-72 overflow-hidden rounded-2xl sm:min-h-80 sm:rounded-3xl">
|
||||
<img
|
||||
src="/block-media/shadcnblocks/block/photos/simone-hutsch-5oYbG-sEImY-unsplash.jpg"
|
||||
alt="سازنده گردش‌کار"
|
||||
@@ -54,32 +62,40 @@ const Feature239 = () => {
|
||||
<div className="absolute inset-0 bg-linear-to-t from-black/70 to-transparent" />
|
||||
</div>
|
||||
|
||||
<div className="absolute top-4 -ms-4 flex size-full flex-col items-center justify-between p-10">
|
||||
<p className="flex w-full items-center text-xl tracking-tighter text-background">
|
||||
با اتصال ابزارهای موجود، داده بین سیستم‌ها خودکار جریان پیدا می‌کند و نیاز به کپی دستی از بین می‌رود.
|
||||
<span className="mx-2 h-2.5 w-px bg-background" />
|
||||
قوانین ساده تعریف کنید تا وظایف تکراری بدون دخالت دست انجام شود. تیم روی تصمیم‌های مهم تمرکز می‌کند و سرعت اجرا بالاتر می‌رود.
|
||||
<div className="absolute inset-0 flex flex-col items-center justify-between p-4 sm:p-6 lg:p-10">
|
||||
<p className="flex w-full min-w-0 flex-col gap-2 text-sm tracking-tighter text-pretty text-background sm:flex-row sm:items-center sm:text-base lg:text-xl">
|
||||
<span className="min-w-0">
|
||||
با اتصال ابزارهای موجود، داده بین سیستم‌ها خودکار جریان
|
||||
پیدا می‌کند و نیاز به کپی دستی از بین می‌رود.
|
||||
</span>
|
||||
<span className="hidden h-2.5 w-px shrink-0 bg-background sm:block" />
|
||||
<span className="min-w-0">
|
||||
قوانین ساده تعریف کنید تا وظایف تکراری بدون دخالت دست
|
||||
انجام شود.
|
||||
</span>
|
||||
</p>
|
||||
<div className="flex flex-col items-center justify-center">
|
||||
<h2 className="text-center text-2xll font-semibold tracking-tight text-balance text-background">
|
||||
<div className="flex flex-col items-center justify-center px-2">
|
||||
<h2 className="text-center text-xl font-semibold tracking-tight text-balance text-background sm:text-2xl lg:text-2xll">
|
||||
کارهای تکراری را خودکار کنید
|
||||
<br />
|
||||
گردش‌کار تیم را بدون کد بسازید
|
||||
</h2>
|
||||
<div className="mt-2 h-1 w-6 rounded-full bg-background" />
|
||||
<p className="mt-10 max-w-sm px-2 text-center text-lg leading-5 font-light tracking-tighter text-pretty text-background/80">
|
||||
فرایندهای بین‌تیمی را در یک بوم بصری طراحی کنید. هر مرحله قابل ردیابی است و گلوگاه‌ها قبل از تأخیر جدی مشخص می‌شوند.
|
||||
<p className="mt-6 max-w-sm text-center text-sm leading-5 font-light tracking-tighter text-pretty text-background/80 sm:mt-10 sm:text-lg">
|
||||
فرایندهای بین‌تیمی را در یک بوم بصری طراحی کنید. هر مرحله
|
||||
قابل ردیابی است و گلوگاه‌ها قبل از تأخیر جدی مشخص
|
||||
می‌شوند.
|
||||
</p>
|
||||
</div>
|
||||
<a
|
||||
href="#"
|
||||
className="group mb-6 flex cursor-pointer flex-col items-center justify-center text-background"
|
||||
className="group mb-2 flex cursor-pointer flex-col items-center justify-center text-background sm:mb-6"
|
||||
>
|
||||
<ChevronUp
|
||||
size={30}
|
||||
className="transition-all ease-in-out group-hover:-translate-y-2"
|
||||
/>
|
||||
<p className="text-xl tracking-tight text-background">
|
||||
<p className="text-base tracking-tight text-background sm:text-xl">
|
||||
مشاهده همه
|
||||
</p>
|
||||
</a>
|
||||
@@ -102,11 +118,11 @@ const DottedDiv = ({
|
||||
children: React.ReactNode;
|
||||
className?: string;
|
||||
}) => (
|
||||
<div className={cn("relative", className)}>
|
||||
<div className="absolute top-4 -start-25 h-px w-[115%] bg-muted" />
|
||||
<div className="absolute bottom-4 -start-25 h-px w-[115%] bg-muted" />
|
||||
<div className="absolute -top-25 start-4 h-[130%] w-px bg-muted" />
|
||||
<div className="absolute -top-25 end-4 h-[130%] w-px bg-muted" />
|
||||
<div className={cn("relative min-w-0 overflow-hidden", className)}>
|
||||
<div className="absolute top-4 start-4 end-4 h-px bg-muted lg:end-auto lg:w-[115%] lg:-start-25" />
|
||||
<div className="absolute bottom-4 start-4 end-4 h-px bg-muted lg:end-auto lg:w-[115%] lg:-start-25" />
|
||||
<div className="absolute start-4 top-4 bottom-4 w-px bg-muted lg:top-auto lg:bottom-auto lg:h-[130%] lg:-top-25" />
|
||||
<div className="absolute end-4 top-4 bottom-4 w-px bg-muted lg:top-auto lg:bottom-auto lg:h-[130%] lg:-top-25" />
|
||||
<div className="absolute start-[12.5px] top-[12.5px] z-10 size-2 rounded-full bg-foreground" />
|
||||
<div className="absolute end-[12.5px] top-[12.5px] z-10 size-2 rounded-full bg-foreground" />
|
||||
<div className="absolute start-[12.5px] bottom-[12.5px] z-10 size-2 rounded-full bg-foreground" />
|
||||
|
||||
Reference in New Issue
Block a user