
# Приставка за типография

`@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` | Шистово сиво |
| `prose-gray` | Сиво |
| `prose-zinc` | Цинково сиво |
| `prose-neutral` | Неутрално |
| `prose-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 поведения на оригиналната приставка — тъмен режим чрез селектор `.dark` и определени формати за конфигурация на варианти на елементи — работят различно в v4 и не се поддържат тук; вместо това използвайте модификатора `prose-invert` и вариантите v4.

Вижте [Приставки](https://tailwindphp.inline0.dev/bg/docs/plugins) за директивата `@plugin` и подробности за зареждането.
