Docs/Componenti
// componente
Testimonial Small
Una singola testimonianza breve, centrata e larga poco più di una colonna di testo: cinque stelle in alto, due frasi, avatar e nome in fondo. È il formato giusto quando vuoi una prova sociale leggera in mezzo alla pagina, senza aprire una sezione intera.
File
components/Testimonial1Small.tsx
Uso base
app/page.tsx
tsx
import Testimonial1Small from "@/components/Testimonial1Small";
<Testimonial1Small />Personalizzare
- Testo: due
<p>hard-coded. Non c'è nessun array: è un componente monouso, se ne vuoi due li duplichi. - Evidenziazione: avvolgi la parte più forte della frase in
<span className="bg-warning/25 px-1.5">. Nel tema di ZeroToShipwarningè il brick, quindi l'evidenziatore viene rosso mattone tenue. - Stelle: cinque SVG generati da
[...Array(5)]con classetext-warning. Per farne quattro, cambia il numero dentroArray(). - Persona:
<Image>+<p className="font-semibold">con nome e riga di contesto (di default “23.1K followers”). L'avatar di esempio è su Unsplash; se usi un host diverso aggiungilo aimages.remotePatternsinnext.config.js.