Puna me Tailwind në NextJS

Në NextJS për stilizim mund të përdorni framework-un CSS Tailwind, i cili përdoret shpesh së bashku me React. Le të shohim se si të përdoret.

Për të punuar me stilimet Tailwind nevojiten dy skedarë: tailwind.config.js dhe postcss.config.js. Meqenëse gjatë instalimit të projektit nga ne u zgjidh pika "përdor stilimet Tailwind", këta skedarë janë tashmë të gjeneruar në projektin tonë dhe ndodhen në rrënjën e tij. Nëse nuk ka skedarë të tillë, atëherë ju duhet të instaloni Tailwind sipas dokumentacionit zyrtar.

Le të shtojmë shkrimin e trashë dhe ngjyrën e verdhë tekstit nga paragrafi me ndihmën e stilimeve Tailwind. Në Tailwind CSS numrat, që përdoren në klasa për ngjyra shënojnë intensitetin ose nuancën e ngjyrës. Këta numra variojnë nga 50 në 900. Për tekstin e paragrafit le të zgjedhim nuancën e mesme:

app/test/page.jsxexport default function Test() {
  return <p className="font-bold text-yellow-500">
    tekst tekst tekst
  </p>;
}