مقالات

blog-gridبلاک

سه کارت مقاله با دسته، تاریخ شمسی، زمان مطالعه و نویسنده.

محتواشمسی
تمام‌صفحه

آخرین مطالب

همه‌ی مطالب

نصب

  1. با CLI

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

    $ npx vibefarsi add blog-grid
  2. نصب دستی

    محتوای تب «کد» را در components/blocks/blog-grid.tsx بگذارید. پیش‌نیاز: badge، avatar.

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

ساخته‌شده از

استفاده

usage.tsx
1import { BlogGrid } from "@/components/blocks/blog-grid"23<BlogGrid posts={[{ href: "/blog/rtl", title: "راست‌چین کردن Next.js", excerpt: "…", category: "آموزش", date: new Date(), readingTime: 6, author: { name: "علی رضایی" } }]} />

پراپ‌ها

پراپنوعپیش‌فرضتوضیح
dateDate-با formatJalali به «۲۵ شهریور ۱۴۰۵» تبدیل میشه.
readingTimenumber-دقیقه؛ با اعداد فارسی نشون داده میشه.