# Typografi-plugin

`@tailwindcss/typography` er en 1:1-port af det officielle typografi-plugin PHP. Det tilføjer klassen `prose` og dens modifikatorer, som giver en blok med gengivet HTML læsbare typografiske standardindstillinger — overskrifter, afsnit, lister, blokcitater, kode, tabeller med mere — uden at style hvert element manuelt.

## Brug

Indlæs pluginet med `@plugin`, og importer utilities-laget. Anvend derefter `prose` på beholderen omkring dit indhold:

```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 genererede regel `.prose` definerer `--tw-prose-*` brugerdefinerede egenskaber (`--tw-prose-body`, `--tw-prose-headings`, `--tw-prose-links`, `--tw-prose-code`, `--tw-prose-quotes` og andre) og styler de underordnede elementer via dem.

## Klasser

### Størrelser

Størrelsesmodifikatorer skalerer hele typografiskalaen. De anvendes sammen med grundklassen `prose`:

| Klasse | Formål |
|-------|---------|
| `prose` | Standardstørrelse |
| `prose-sm` | Lille |
| `prose-base` | Grundstørrelse |
| `prose-lg` | Stor |
| `prose-xl` | Ekstra stor |
| `prose-2xl` | 2× ekstra stor |

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

### Farvetemaer

Farvemodifikatorer udskifter gråskalaen, der bruges til brødtekst, overskrifter og kanter:

| Klasse | Tema |
|-------|-------|
| `prose-slate` | Skifer |
| `prose-gray` | Grå |
| `prose-zinc` | Zink |
| `prose-neutral` | Neutral |
| `prose-stone` | Sten |

### Invertering

`prose-invert` vender farvepaletten om, så den kan bruges på mørke baggrunde. Kombiner den frit med størrelses- og farvemodifikatorer:

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

## Indstillinger

### `className`

Som standard genererer pluginet klassen `prose`. Indstil `className` for at omdøbe den — modifikatorerne følger det nye navn (`markdown`, `markdown-lg`, `markdown-invert`, …). Når den indstilles, genereres klasserne `prose` ikke:

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

## Noter

Elementmodifikatorer såsom `prose-headings:underline` eller `prose-a:text-blue-600` registreres, men i den aktuelle udgave kompileres de uden deres elementselektor. Derfor anvendes utility-klassen på hele beholderen `prose` i stedet for overskrifterne eller linkene i den ([#10](https://github.com/inline0/tailwindphp/issues/10)). Style disse elementer med din egen CSS, indtil rettelsen er på plads.

Dette er en TailwindCSS-port v4. Nogle v3-specifikke funktioner fra det oprindelige plugin — mørk tilstand via selektoren `.dark` og visse formater til elementvariantkonfiguration — fungerer anderledes i v4 og understøttes ikke her. Brug i stedet modifikatoren `prose-invert` og varianterne v4.

Se [Plugins](https://tailwindphp.inline0.dev/da/docs/plugins) for oplysninger om direktivet `@plugin` og indlæsning.