پژواک

sonarپس‌زمینه

حلقه‌هایی که از مرکز بزرگ و محو میشن، برای «در حال جست‌وجو» و نقشه.

متن روی پس‌زمینه

در همه‌ی تم‌ها باید خوانا بمونه.

نصب

  1. با CLI

    اگر هنوز init نکردید، اول از راهنمای نصب پروژه را آماده کنید. بعد این دستور کامپوننت و وابستگی‌هاش را می‌نویسه.

    $ npx vibefarsi add sonar
  2. نصب دستی

    محتوای تب «کد» را در components/backgrounds/sonar.tsx بگذارید. کلیدفریم را هم به globals.css اضافه کنید.

    $ npm i lucide-react
    کپی کل فایلregistry json

استفاده

usage.tsx
1import { SonarBackground } from "@/components/backgrounds/sonar"23<section className="relative overflow-hidden">4  <SonarBackground rings={4} />5  <div className="relative"></div>6</section>

پراپ‌ها

پراپنوعپیش‌فرضتوضیح
rings / durationnumber4 / 6تعداد حلقه و مدت هر دور.