ar.badiei/reui-blocks
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

some edit

Browse Source
This commit is contained in:
mr.sabri
2026-08-13 20:38:45 +03:30
parent 1cea5b78cb
commit 031e0cc413
24 changed files with 462 additions and 330 deletions
Download Patch File Download Diff File Expand all files Collapse all files
blocks/feature236.tsx
+41 -22
View File
@@ -14,44 +14,63 @@ interface Feature236Props {
const Feature236 = ({ className }: Feature236Props) => {
return (
<section dir="rtl" lang="fa" className={cn("bg-background py-32", className)}>
<div className="container flex flex-col items-center gap-10 md:gap-0">
<section
dir="rtl"
lang="fa"
className={cn(
"w-full min-w-0 overflow-x-hidden bg-background py-12 sm:py-20 lg:py-32",
className,
)}
>
<div className="container flex min-w-0 flex-col items-center gap-8 px-4 sm:gap-10 sm:px-6 md:gap-0">
<Button
variant="outline"
className="flex items-center justify-center gap-5 rounded-full px-5! py-5 text-sm font-medium text-muted-foreground"
className="h-auto max-w-full gap-3 rounded-full px-4 py-4 text-sm font-medium whitespace-normal text-muted-foreground sm:gap-5 sm:px-5 sm:py-5"
>
<Group />
تمام تعاملات، سرنخ‌ها و قراردادها در یک فضای کاری متمرکز جمع می‌شود. تیم فروش بدون جابجایی بین ابزارها، سریع‌تر پیش‌بینی می‌کند و معاملات بیشتری می‌بندد.
<ArrowUpRight className="rtl:rotate-180" />
<Group className="size-4 shrink-0 sm:size-5" />
<span className="text-pretty">
تمام تعاملات، سرنخ‌ها و قراردادها در یک فضای کاری متمرکز جمع می‌شود.
تیم فروش بدون جابجایی بین ابزارها، سریع‌تر پیش‌بینی می‌کند و معاملات
بیشتری می‌بندد.
</span>
<ArrowUpRight className="size-4 shrink-0 rtl:rotate-180" />
</Button>
<BracketedBorder>
<div className="mb-7 flex items-center justify-center gap-5 tracking-tight">
<div className="relative flex items-center justify-center">
<div className="mb-5 flex w-full min-w-0 max-w-2xl items-center justify-center gap-3 px-2 tracking-tight sm:mb-7 sm:gap-5 sm:px-4">
<div className="relative flex shrink-0 items-center justify-center">
<span className="absolute inline-block size-2 rounded-full bg-green-300" />
<span className="absolute inline-block size-3 animate-ping rounded-full bg-green-300" />
</div>
<p>از اولین تماس تا تمدید قرارداد، هر مرحله فروش قابل ردیابی است. گزارش‌های لحظه‌ای به مدیران کمک می‌کند گلوگاه‌ها را قبل از از دست دادن درآمد شناسایی کنند.</p>
<p className="min-w-0 text-pretty text-sm text-muted-foreground sm:text-base">
از اولین تماس تا تمدید قرارداد، هر مرحله فروش قابل ردیابی است.
گزارش‌های لحظه‌ای به مدیران کمک می‌کند گلوگاه‌ها را قبل از از دست
دادن درآمد شناسایی کنند.
</p>
</div>
<h1 className="max-w-xl px-4 text-center text-2xll font-semibold tracking-tighter text-balance text-foreground md:text-[90px] md:leading-22">
<h1 className="max-w-full px-2 text-center text-3xl font-semibold tracking-tighter text-balance text-foreground sm:px-4 sm:text-4xl md:max-w-3xl md:text-5xl md:leading-tight lg:text-6xl xl:text-7xl">
هر سرنخ را تا قرارداد دنبال کنید
</h1>
</BracketedBorder>
<h2 className="text-3xl font-medium tracking-tighter text-foreground">
<h2 className="max-w-full px-2 text-center text-2xl font-medium tracking-tighter text-balance text-foreground sm:text-3xl">
فروش تیم‌تان را یکجا مدیریت کنید
</h2>
<p className="max-w-2xl px-10 text-center text-pretty text-muted-foreground sm:mt-5 lg:text-xl">
پروفایل یکپارچه مشتری، تاریخچه تماس و وضعیت معامله را همزمان نشان می‌دهد. تیم‌ها با دید مشترک، هماهنگ‌تر پیش می‌روند و نرخ تبدیل بالاتر می‌رود.
<p className="max-w-2xl px-2 text-center text-pretty text-muted-foreground sm:mt-5 sm:px-6 lg:text-xl">
پروفایل یکپارچه مشتری، تاریخچه تماس و وضعیت معامله را همزمان نشان
می‌دهد. تیم‌ها با دید مشترک، هماهنگ‌تر پیش می‌روند و نرخ تبدیل بالاتر
می‌رود.
</p>
<div className="flex flex-col gap-4 sm:mt-8 md:flex-row">
<Button className="h-11 w-full rounded-xl sm:w-auto">
<div className="flex w-full min-w-0 max-w-2xl flex-col gap-4 sm:mt-8 md:flex-row md:justify-center">
<Button className="h-auto min-h-11 w-full rounded-xl px-4 py-2 whitespace-normal sm:w-auto">
روابط مشتری را در یک نگاه ببینید
</Button>
<Button
variant="outline"
className="h-11 w-full gap-2 rounded-xl sm:w-auto"
className="h-auto min-h-11 w-full gap-2 rounded-xl px-4 py-2 whitespace-normal sm:w-auto"
>
پایپ‌لاین فروش را شفاف کنید
<ArrowRight className="size-4 rtl:rotate-180" />
<ArrowRight className="size-4 shrink-0 rtl:rotate-180" />
</Button>
</div>
</div>
@@ -61,12 +80,12 @@ const Feature236 = ({ className }: Feature236Props) => {
const BracketedBorder = ({ children }: { children: ReactNode }) => (
<motion.div
initial={{ width: 0, opacity: 0 }}
className="relative flex flex-col items-center justify-center sm:my-10 md:h-[500px] md:overflow-hidden"
whileInView={{ width: "65vw", opacity: 1 }}
initial={{ opacity: 0, scaleX: 0.85 }}
className="relative flex w-full min-w-0 max-w-full flex-col items-center justify-center overflow-hidden sm:my-10 md:min-h-[500px]"
whileInView={{ opacity: 1, scaleX: 1 }}
viewport={{ once: true }}
transition={{
width: {
scaleX: {
type: "spring",
stiffness: 50,
damping: 20,
@@ -86,7 +105,7 @@ const BracketedBorder = ({ children }: { children: ReactNode }) => (
<Vector className="absolute start-1 bottom-1" />
<Vector className="absolute end-1 bottom-1 -rotate-90" />
</div>
<div className="flex h-full w-screen flex-col items-center justify-center">
<div className="flex w-full min-w-0 max-w-4xl flex-col items-center justify-center px-4 py-8 md:max-w-[65vw] md:py-12">
{children}
</div>
</motion.div>