# Začetek

## Namestitev

```bash
composer require tailwindphp/tailwindphp
```

TailwindPHP potrebuje PHP 8.2 ali novejši z razširitvama `ctype` in `mbstring` ter Composer. Obe razširitvi sta del večine gradenj PHP in uradnih slik Docker; `composer.json` ju še ne navaja ([#11](https://github.com/inline0/tailwindphp/issues/11)), zato se paket v gradnji brez njiju namesti, a med izvajanjem odpove. Odvisnost od Node.js, korak gradnje ali npm v sliki Docker oziroma CI niso potrebni. Samo `composer require` in pokličite API.

## Ustvarite svoj prvi CSS

```php
<?php

require __DIR__ . '/vendor/autoload.php';

use TailwindPHP\tw;

$css = tw::generate('<div class="flex items-center p-4 bg-blue-500">Hello</div>');
```

`generate()` pregleda označevalni jezik, izlušči imena razredov, ki jih najde, in ustvari samo CSS, ki jih ti razredi potrebujejo — nič več. Če ne podate drugega argumenta, uporabi privzeti `@import "tailwindcss"`, ki vključi temo, [Preflight](https://tailwindphp.inline0.dev/sl/docs/usage/imports) in plast pripomočkov.

## Prilagajanje z nizom CSS

Kot drugi argument podajte vhodni niz CSS, da dodate spremenljivke `@theme`, pravila po meri ali direktive. Nove vrednosti teme samodejno postanejo pripomočki:

```php
use TailwindPHP\tw;

$css = tw::generate(
    '<div class="bg-brand p-4">Hello</div>',
    '@import "tailwindcss"; @theme { --color-brand: #3b82f6; }'
);
// .bg-brand now resolves to var(--color-brand)
```

Celoten nabor imenskih prostorov teme je opisan v razdelku [Tema](https://tailwindphp.inline0.dev/sl/docs/usage/theme).

## Vhod v obliki polja

Za vse, kar je obsežnejše od enovrstičnega zapisa, podajte polje s ključema `content` in `css`. Tukaj določite komponente z `@apply`:

```php
use TailwindPHP\tw;

$css = tw::generate([
    'content' => '<div class="flex p-4 btn">Hello</div>',
    'css' => '
        @import "tailwindcss";

        @theme {
            --color-brand: #3b82f6;
            --font-heading: "Inter", sans-serif;
        }

        .btn {
            @apply px-4 py-2 rounded-lg bg-brand text-white;
        }
    ',
]);
```

Oblika polja sprejema tudi `minify`, `importPaths`, `cache` in `cacheTtl`. Oblike vhodov so opisane v razdelku [Uporaba](https://tailwindphp.inline0.dev/sl/docs/usage), direktive, kot so `@apply`, `@theme`, `@utility` in druge, pa v razdelku [Direktive](https://tailwindphp.inline0.dev/sl/docs/usage/directives).

## Zapis v datoteko

`generate()` vrne niz, zato je zapis slogovne datoteke enovrstičen:

```php
use TailwindPHP\tw;

file_put_contents('dist/styles.css', tw::generate([
    'content' => file_get_contents('templates/page.html'),
    'css' => '@import "tailwindcss";',
]));
```

Za gradnje na podlagi datotek, ki pregledujejo imenik predlog, in za način spremljanja raje uporabite [CLI](https://tailwindphp.inline0.dev/sl/docs/cli). Uporablja možnosti gradnje `@tailwindcss/cli`, vendar se njegovo pregledovanje vsebine trenutno razlikuje od pregledovanja pri Tailwind; na strani CLI je navedeno, kaj pregleduje.

## Minifikacija za produkcijo

Podajte `minify => true`, da med ustvarjanjem stisnete izhod, ali pokličite `tw::minify()` za obstoječi niz:

```php
use TailwindPHP\tw;

// Minify during generation
$css = tw::generate([
    'content' => '<div class="flex p-4">Hello</div>',
    'minify' => true,
]);

// Or minify separately
$css = tw::generate('<div class="flex p-4">Hello</div>');
$minified = tw::minify($css);
```

Minifikator odstrani komentarje, strne presledke, skrajša šestnajstiške barve (`#ffffff` v `#fff`) in pri vrednostih nič odstrani enote (`0px` v `0`). Možnosti predpomnjenja najdete v razdelku [Predpomnjenje in minifikacija](https://tailwindphp.inline0.dev/sl/docs/advanced/caching).

## Naslednji koraki

- [Uporaba](https://tailwindphp.inline0.dev/sl/docs/usage) — potek ustvarjanja, pregledovanje vsebine in oblike vhodov.
- [Pripomočki razredov](https://tailwindphp.inline0.dev/sl/docs/class-utilities) — `cn()`, `merge()`, `join()` in `variants()`.
- [Vtičniki](https://tailwindphp.inline0.dev/sl/docs/plugins) — tipografija, obrazci in vtičniki po meri.
- [API](https://tailwindphp.inline0.dev/sl/docs/api) — celoten nabor `tw` in primerki prevajalnika za ponovno uporabo.
- [CLI](https://tailwindphp.inline0.dev/sl/docs/cli) — gradnje na podlagi datotek in spremljane gradnje brez Node.js.