هیرو
heroبلاکتیتر بزرگ وسطچین با دو دکمه و یک خط اثبات اجتماعی، روی شبکهی محو.
لندینگشروع
نسخهی ۲ منتشر شد
فروشگاهتان را امروز باز کنید، نه ماه بعد
درگاه بانکی، پست، فاکتور شمسی و هوش مصنوعی که به زبان مشتریهای شما حرف میزند؛ همه آماده.
سعنر
فروشگاههای فعال روی دکاننصب
با CLI
اگر هنوز init نکردید، اول از راهنمای نصب پروژه را آماده کنید. بعد این دستور کامپوننت و وابستگیهاش را مینویسه.
$ npx vibefarsi add heroنصب دستی
محتوای تب «کد» را در
components/blocks/hero.tsxبگذارید. پیشنیاز: button، badge، avatar.$ npm i lucide-reactکپی کل فایلregistry json
ساختهشده از
استفاده
usage.tsx
1import { HeroBlock } from "@/components/blocks/hero"23<HeroBlock4 badge="نسخهی ۲ منتشر شد"5 title={<>فروشگاهتان را امروز باز کنید، <span className="text-brand">نه ماه بعد</span></>}6 description="درگاه بانکی، پست، فاکتور شمسی و هوش مصنوعی فارسی، همه از روز اول آماده."7 primary={{ label: "ساخت فروشگاه رایگان" }}8 proof={{ people: [{ name: "سارا" }, { name: "علی" }, { name: "نگار" }], text: "بیش از ۲ هزار فروشگاه" }}9/>پراپها
| پراپ | نوع | پیشفرض | توضیح |
|---|---|---|---|
| title | ReactNode | - | تیتر. میتونید یک کلمه را با text-brand برجسته کنید. |
| proof | { people; text } | - | آواتارها و متن اثبات اجتماعی. |