keyhan
dfacfdc6cf
Replace the root redirect with a scroll-driven three.js scene that flies from overcast clouds through rain and a thunderstorm into a clear blue sunny sky, fronted by Persian/RTL marketing sections. The dashboard at /dashboard is untouched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
33 lines
1.1 KiB
TypeScript
33 lines
1.1 KiB
TypeScript
'use client';
|
||
|
||
import { Reveal } from '../Reveal';
|
||
import { steps } from '../content';
|
||
|
||
export function HowItWorks() {
|
||
return (
|
||
<section className="relative px-6 py-28">
|
||
<div className="mx-auto max-w-5xl">
|
||
<Reveal className="mb-16 flex justify-center">
|
||
<h2 className="abrban-panel abrban-ink rounded-3xl px-8 py-5 text-4xl font-bold text-white">
|
||
به سادگیِ سه قدم
|
||
</h2>
|
||
</Reveal>
|
||
|
||
<div className="grid gap-8 md:grid-cols-3">
|
||
{steps.map((s, i) => (
|
||
<Reveal key={s.n} delay={i * 0.1}>
|
||
<div className="abrban-panel relative rounded-2xl p-8 text-center">
|
||
<div className="mx-auto flex h-14 w-14 items-center justify-center rounded-full bg-primary-600/35 text-2xl font-black text-primary-100 ring-1 ring-primary-400/50">
|
||
{s.n}
|
||
</div>
|
||
<h3 className="abrban-ink mt-5 text-xl font-bold text-white">{s.title}</h3>
|
||
<p className="mt-2 leading-8 text-white/80">{s.desc}</p>
|
||
</div>
|
||
</Reveal>
|
||
))}
|
||
</div>
|
||
</div>
|
||
</section>
|
||
);
|
||
}
|