# إضافة الطباعة

`@tailwindcss/typography` نسخة مطابقة بنسبة 1:1 من PHP الإضافة الرسمية للطباعة. تضيف فئة `prose` ومعدّلاتها لتطبيق إعدادات طباعية سهلة القراءة على كتلة من محتوى HTML المعروض — مثل العناوين والفقرات والقوائم والاقتباسات البرمجية والأكواد والجداول وغيرها — دون تنسيق كل عنصر يدويًا.

## الاستخدام

حمّل الإضافة باستخدام `@plugin` واستورد طبقة الأدوات، ثم طبّق `prose` على الحاوية التي تضم محتواك:

```php
use TailwindPHP\tw;

$css = tw::generate(
    '<article class="prose prose-lg"><h1>Title</h1><p>Body text…</p></article>',
    '@plugin "@tailwindcss/typography"; @import "tailwindcss/utilities.css";'
);
```

تعرّف القاعدة المُنشأة `.prose` خصائص مخصصة `--tw-prose-*` (`--tw-prose-body` و`--tw-prose-headings` و`--tw-prose-links` و`--tw-prose-code` و`--tw-prose-quotes` وغيرها)، وتنسّق العناصر التابعة باستخدامها.

## الفئات

### الأحجام

تغيّر معدّلات الحجم مقياس تدرج الأحجام الطباعية بالكامل. وتُستخدم إلى جانب الفئة الأساسية `prose`:

| الفئة | الغرض |
|-------|---------|
| `prose` | الحجم الافتراضي |
| `prose-sm` | صغير |
| `prose-base` | أساسي |
| `prose-lg` | كبير |
| `prose-xl` | كبير جدًا |
| `prose-2xl` | أكبر بمقدار 2× |

```html
<article class="prose prose-xl">…</article>
```

### سمات الألوان

تبدّل معدّلات اللون درجات الرمادي المستخدمة لنص المتن والعناوين والحدود:

| الفئة | السمة |
|-------|-------|
| `prose-slate` | Slate |
| `prose-gray` | Gray |
| `prose-zinc` | Zinc |
| `prose-neutral` | Neutral |
| `prose-stone` | Stone |

### عكس الألوان

تعكس `prose-invert` لوحة الألوان للاستخدام على الخلفيات الداكنة. يمكنك دمجها بحرية مع معدّلات الحجم واللون:

```html
<article class="prose prose-lg prose-slate prose-invert">…</article>
```

## الخيارات

### `className`

ينشئ الملحق افتراضيًا الفئة `prose`. عيّن `className` لإعادة تسميتها — وتتبعها المعدّلات بالاسم الجديد (`markdown` و`markdown-lg` و`markdown-invert`، …). وعند تعيين هذا الخيار، لا تُنشأ فئات `prose`:

```php
$css = tw::generate(
    '<article class="markdown markdown-lg">…</article>',
    '
        @plugin "@tailwindcss/typography" {
            className: "markdown";
        }
        @import "tailwindcss/utilities.css";
    '
);
```

## ملاحظات

تُسجّل معدّلات العناصر مثل `prose-headings:underline` أو `prose-a:text-blue-600`، لكنها تُترجم في الإصدار الحالي من دون محدد العنصر؛ لذا تُطبّق الأداة على حاوية `prose` بأكملها بدلًا من العناوين أو الروابط داخلها ([#10](https://github.com/inline0/tailwindphp/issues/10)). نسّق هذه العناصر باستخدام CSS الخاصة بك إلى أن يتوفر الإصلاح.

هذا نقل TailwindCSS لـ v4. تعمل بعض سلوكيات v3-specific في الإضافة الأصلية بشكل مختلف في v4 وغير مدعومة هنا، ومنها الوضع الداكن باستخدام محدد `.dark` وبعض تنسيقات إعدادات متغيرات العناصر؛ استخدم المعدِّل `prose-invert` ومتغيرات v4 بدلًا منها.

راجع [الإضافات](https://tailwindphp.inline0.dev/ar/docs/plugins) لمعرفة توجيه `@plugin` وتفاصيل التحميل.