# Wtyczka typografii

`@tailwindcss/typography` to 1:1 PHP oficjalnej wtyczki typografii. Dodaje klasę `prose` i jej modyfikatory, które stosują czytelne domyślne style typograficzne do bloku renderowanego HTML — nagłówków, akapitów, list, cytatów blokowych, kodu, tabel i innych elementów — bez konieczności ręcznego stylowania każdego z nich.

## Użycie

Załaduj wtyczkę przez `@plugin` i zaimportuj warstwę utilities, a następnie zastosuj `prose` do kontenera obejmującego treść:

```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";'
);
```

Wygenerowana reguła `.prose` definiuje `--tw-prose-*` własnych właściwości (`--tw-prose-body`, `--tw-prose-headings`, `--tw-prose-links`, `--tw-prose-code`, `--tw-prose-quotes` i inne) i styluje elementy potomne za ich pomocą.

## Klasy

### Rozmiary

Modyfikatory rozmiaru skalują całą skalę typograficzną. Stosuje się je wraz z bazową klasą `prose`:

| Klasa | Zastosowanie |
|-------|---------|
| `prose` | Domyślny rozmiar |
| `prose-sm` | Mały |
| `prose-base` | Podstawowy |
| `prose-lg` | Duży |
| `prose-xl` | Bardzo duży |
| `prose-2xl` | 2× bardzo duży |

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

### Motywy kolorystyczne

Modyfikatory kolorów zmieniają skalę szarości używaną dla tekstu głównego, nagłówków i obramowań:

| Klasa | Motyw |
|-------|-------|
| `prose-slate` | Łupkowy |
| `prose-gray` | Szary |
| `prose-zinc` | Cynkowy |
| `prose-neutral` | Neutralny |
| `prose-stone` | Kamienny |

### Odwrócenie

`prose-invert` odwraca paletę kolorów na potrzeby ciemnych teł. Można go dowolnie łączyć z modyfikatorami rozmiaru i koloru:

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

## Opcje

### `className`

Domyślnie wtyczka generuje klasę `prose`. Ustaw `className`, aby zmienić jej nazwę — modyfikatory przyjmą nową nazwę (`markdown`, `markdown-lg`, `markdown-invert`, …). Po ustawieniu tej opcji klasy `prose` nie są generowane:

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

## Uwagi

Modyfikatory elementów, takie jak `prose-headings:underline` lub `prose-a:text-blue-600`, są zarejestrowane, ale w bieżącej wersji kompilują się bez selektora elementu, więc narzędzie jest stosowane do całego kontenera `prose` zamiast do zawartych w nim nagłówków lub linków ([#10](https://github.com/inline0/tailwindphp/issues/10)). Do czasu naprawy stylizuj te elementy za pomocą własnego CSS.

To port TailwindCSS v4. Niektóre zachowania specyficzne dla v3 z oryginalnej wtyczki — tryb ciemny selektora `.dark` oraz niektóre formaty konfiguracji wariantów elementów — działają inaczej w v4 i nie są tu obsługiwane; użyj zamiast nich modyfikatora `prose-invert` i wariantów v4.

Zobacz [Wtyczki](https://tailwindphp.inline0.dev/pl/docs/plugins), aby poznać dyrektywę `@plugin` i szczegóły wczytywania.