Laajennukset

TailwindPHP sisältää virallisten TailwindCSS-laajennusten PHP-porttaukset ja tarjoaa natiivin PHP-laajennusrajapinnan API. Laajennuksilla rekisteröidään apuohjelmia, komponentteja ja variantteja. Ne ladataan syöte-CSSn @plugin-direktiivillä. Sisäänrakennetut laajennukset ovat alkuperäisten JavaScript-vastineidensa 1:1-porttauksia — samat valitsimet ja tuloste — ja ne on toteutettu PHPlla Node-tulkkauksen sijaan. Tällä hetkellä yksi poikkeus: typografialaajennuksen elementtimuokkaimet (prose-headings:, prose-a:, …) perustuvat laajennusvariantteihin, joita ei vielä käytetä (#10).

@pluginn käyttö

Viittaa laajennukseen nimellä komennolla @plugin. Sisäänrakennetut laajennukset käyttävät npm-pakettinimeään. Lisää direktiivin pariksi @import "tailwindcss/utilities.css";, jotta laajennuksen luokat tuotetaan apuohjelmakerrokseen:

use TailwindPHP\tw;

$css = tw::generate([
    'content' => '<article class="prose prose-lg"><h1>Hello</h1><p>Content here</p></article>',
    'css' => '
        @plugin "@tailwindcss/typography";
        @import "tailwindcss/utilities.css";
    ',
]);

Voit ladata useita laajennuksia yhdessä, ja niiden järjestyksellä ei ole merkitystä:

@plugin "@tailwindcss/typography";
@plugin "@tailwindcss/forms";
@import "tailwindcss/utilities.css";

@plugin-direktiiviä ei voi sijoittaa toisen at-säännön (kuten @media) sisään. Rekisteröimättömän laajennuksen nimen käyttö aiheuttaa virheen.

Laajennusten asetukset

Välitä laajennukselle asetuksia nimen jälkeen tulevalla CSS-lohkon syntaksilla. Avaimet vastaavat laajennuksen asetusarvoja sisältävää taulukkoa:

@plugin "@tailwindcss/forms" {
    strategy: "class";
}

@plugin "@tailwindcss/typography" {
    className: "markdown";
}

@tailwindcss/forms-laajennus hyväksyy arvon strategy (base tai class). @tailwindcss/typography hyväksyy arvon className luodun prose-luokan uudelleennimeämiseen. Katso kaikki asetukset laajennusten omilta sivuilta.

Sisäänrakennetut laajennukset

Mukautetut laajennukset

Kirjoita oma laajennus toteuttamalla PluginInterface ja käyttämällä PluginAPIn metodeja (addUtilities, matchUtilities, addComponents, addVariant, theme ja muita). Rekisteröi laajennus komennolla registerPlugin(new MyPlugin()), jotta metodin getName() palauttama nimi löytyy @plugin "my-plugin"-direktiivistä:

use function TailwindPHP\registerPlugin;

registerPlugin(new MyCustomPlugin());

Katso sivulta Mukautetut laajennukset rajapinta, kokonainen esimerkki ja täydellinen PluginAPI-metodien viite.