
# Typografiplugin

`@tailwindcss/typography` är en 1:1 PHP-port av den officiella typografipluginen. Den lägger till klassen `prose` och dess modifierare, som ger ett block med renderad HTML lättlästa typografiska standardinställningar – för rubriker, stycken, listor, citatblock, kod, tabeller med mera – utan att du behöver formge varje element för hand.

## Användning

Ladda pluginen med `@plugin` och importera verktygslagret. Använd sedan `prose` på behållaren som omsluter innehållet:

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

Den genererade regeln `.prose` definierar `--tw-prose-*` anpassade egenskaper (`--tw-prose-body`, `--tw-prose-headings`, `--tw-prose-links`, `--tw-prose-code`, `--tw-prose-quotes` med flera) och formger underordnade element med hjälp av dem.

## Klasser

### Storlekar

Storleksmodifierare skalar hela typografiskalan. De används tillsammans med basklassen `prose`:

| Klass | Syfte |
|-------|---------|
| `prose` | Standardstorlek |
| `prose-sm` | Liten |
| `prose-base` | Grundstorlek |
| `prose-lg` | Stor |
| `prose-xl` | Extra stor |
| `prose-2xl` | 2× extra stor |

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

### Färgteman

Färgmodifierare byter gråskalan som används för brödtext, rubriker och kantlinjer:

| Klass | Tema |
|-------|-------|
| `prose-slate` | Skiffer |
| `prose-gray` | Grå |
| `prose-zinc` | Zink |
| `prose-neutral` | Neutral |
| `prose-stone` | Sten |

### Invertera

`prose-invert` vänder på färgpaletten för användning mot mörka bakgrunder. Kombinera den fritt med storleks- och färgmodifierare:

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

## Alternativ

### `className`

Som standard genererar pluginen klassen `prose`. Ange `className` för att byta namn på den – modifierarna följer det nya namnet (`markdown`, `markdown-lg`, `markdown-invert`, …). När alternativet anges genereras inte klasserna `prose`:

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

## Kommentarer

Elementmodifierare som `prose-headings:underline` eller `prose-a:text-blue-600` registreras, men i den aktuella versionen kompileras de utan sin elementselektor. Därför gäller verktyget hela behållaren `prose` i stället för rubrikerna eller länkarna inuti den ([#10](https://github.com/inline0/tailwindphp/issues/10)). Formge elementen med din egen CSS tills felet har åtgärdats.

Det här är en TailwindCSS v4-port. Vissa funktioner som är specifika för v3 i originalpluginen – mörkt läge med selektorn `.dark` och vissa format för elementvariantkonfiguration – fungerar annorlunda i v4 och stöds inte här. Använd i stället modifieraren `prose-invert` och varianterna v4.

Se [Insticksprogram](https://tailwindphp.inline0.dev/sv/docs/plugins) för direktivet `@plugin` och information om inläsning.
