Práca s Tailwind v NextJS
V NextJS pre štýlovanie môžete použiť CSS framework Tailwind, ktorý sa často používa spolu s Reactom. Pozrime sa, ako ho používať.
Pre prácu so štýlmi
Tailwind sú potrebné dva súbory:
tailwind.config.js a
postcss.config.js. Keďže pri inštalácii
projektu sme vybrali možnosť "použiť
štýly Tailwind", tieto súbory sú už vygenerované
v našom projekte a
nachádzajú sa v jeho koreni. Ak takéto súbory neexistujú, musíte nainštalovať Tailwind podľa
oficiálnej dokumentácie.
Pridajme polotučné písmo
a žltú farbu textu odseku pomocou štýlov
Tailwind. V Tailwind CSS čísla,
používané v triedach pre farby
označujú intenzitu alebo odtieň farby.
Tieto čísla sa pohybujú od 50 do
900. Pre text odseku vyberme
stredný odtieň:
export default function Test() {
return <p className="font-bold text-yellow-500">
text text text
</p>;
}
Skúste použiť Tailwind štýly vo vašom projekte.
