msb-public
/
vitepress
mirror of https://github.com/vuejs/vitepress
2
1
Code Issues Projects Releases Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from '3eb4374af2'
${ noResults }
vitepress/docs/fa/reference/default-theme-badge.md

2.5 KiB
Raw Blame History

نشان

برچسب به شما امکان می‌دهد وضعیت‌های مختلفی را به سربرگ‌های خود اضافه کنید. به عنوان مثال، می‌تواند مفید باشد تا نوع بخش را مشخص کنید یا نسخه‌های پشتیبانی شده را نشان دهید.

استفاده

شما می‌توانید از کامپوننت Badge که به صورت جهانی در دسترس است، استفاده کنید.

### عنوان <Badge type="info" text="پیش‌فرض" />
### عنوان <Badge type="tip" text="^1.9.0" />
### عنوان <Badge type="warning" text="بتا" />
### عنوان <Badge type="danger" text="هشدار" />

کد بالا به صورت زیر نمایش داده می‌شود:

عنوان

عنوان

عنوان

عنوان

ارائه دادن محتوای دلخواه

<Badge> می‌پذیرد children که در برچسب نمایش داده خواهد شد.

### عنوان <Badge type="info">عنصر سفارشی</Badge>

عنوان عنصر سفارشی

سفارشی‌سازی رنگ نوع

شما می‌توانید استایل برچسب‌ها را با دوباره‌نویسی متغیرهای css سفارشی کنید. مقادیر پیش‌فرض به شرح زیر هستند:

:root {
  --vp-badge-info-border: transparent;
  --vp-badge-info-text: var(--vp-c-text-2);
  --vp-badge-info-bg: var(--vp-c-default-soft);

  --vp-badge-tip-border: transparent;
  --vp-badge-tip-text: var(--vp-c-brand-1);
  --vp-badge-tip-bg: var(--vp-c-brand-soft);

  --vp-badge-warning-border: transparent;
  --vp-badge-warning-text: var(--vp-c-warning-1);
  --vp-badge-warning-bg: var(--vp-c-warning-soft);

  --vp-badge-danger-border: transparent;
  --vp-badge-danger-text: var(--vp-c-danger-1);
  --vp-badge-danger-bg: var(--vp-c-danger-soft);
}

<Badge>

کامپوننت <Badge> پراپ‌های زیر را می‌پذیرد:

interface Props {
  // وقتی `<slot>` ارسال می‌شود، این مقدار نادیده گرفته می‌شود.
  text?: string

  // پیش‌فرض به `tip`.
  type?: 'info' | 'tip' | 'warning' | 'danger'
}