Testimonial Grid

Il muro di testimonianze: 11 card disposte su quattro colonne, con l'ultima della lista promossa a citazione grande al centro (doppia colonna, testo più grande). Ogni card può portare l'icona della fonte — Twitter o Product Hunt — e una card può essere un video con play/pause custom. Client component.

File

components/Testimonials11.tsx

Uso base

import Testimonials11 from "@/components/Testimonials11";

<Testimonials11 />

Personalizzare

• Le testimonianze: l'array list. Servono 11 voci per chiudere la griglia. La undicesima è quella featured al centro: mettici la più forte, perché viene letta per prima.
• Fonte: il campo type prende un valore dall'oggetto refTypes — twitter, productHunt, video o other. Con twitter o productHunt compare l'icona; se aggiungi anche link, la card diventa cliccabile verso il post originale.
• Video: metti type: refTypes.video e riempi videoSrc, videoPoster, videoWidth, videoHeight e (opzionale) videoType. Il sotto-componente VideoTestimonial gestisce play, pausa e lo spinner di caricamento.
• Nuove fonti: per aggiungere, per esempio, un badge LinkedIn, aggiungi una chiave a refTypes con { id, ariaLabel, svg } e aggiorna il tipo sopra l'oggetto.
• Avatar: come nelle altre varianti, se manca img compare l'iniziale del nome.
• Attenzione al mobile: la colonna centrale (card featured + quattro card) è hidden md:grid, quindi su telefono si vedono solo le prime 3 e le ultime 3. Tienilo presente quando decidi l'ordine.