Componente di feedback
Un componente di feedback minimalista con design reattivo, supporto per temi scuri e assenza di JavaScript. Include un avatar, un testo di feedback dell'utente e valutazioni rappresentate da stelle.
Codice HTML
<div class="max-w-md mx-auto p-6 bg-white rounded-lg shadow-md dark:bg-gray-800 transition-shadow duration-300 ease-in-out">
<div class="flex items-center mb-4">
<img class="w-12 h-12 rounded-full" src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar">
<div class="ml-4">
<h2 class="text-lg font-semibold text-gray-800 dark:text-white">John Doe</h2>
<span class="text-gray-500 dark:text-gray-400 text-sm">2 hours ago</span>
</div>
</div>
<div class="mb-4">
<div class="flex items-center">
<span class="text-yellow-500">
📍📍📍📍📍
</span>
<span class="text-gray-500 dark:text-gray-400 ml-2">Rating: 4.5/5</span>
</div>
</div>
<p class="text-gray-700 dark:text-gray-300">
This is a sample feedback message from the user. It highlights the positive aspects and any areas for improvement.
</p>
<div class="mt-4">
<img class="rounded-md" src="https://picsum.photos/400/200" alt="Feedback Image">
</div>
</div>Componenti correlati
Componente di feedback senza scopo di lucro (stile 3D)
Un componente di feedback semplice e reattivo per le organizzazioni non profit, caratterizzato da un'estetica di design 3D e dai toni caldi del tramonto. Include il supporto per la modalità oscura.
Componente di feedback
Componente di feedback ispirato allo scheumorfismo con una combinazione di colori analoga per un cruscotto. Progettato per essere semplice, reattivo e supporta la modalità oscura utilizzando Tailwind CSS. Utilizza shadcn/ui per migliorare lo stile e i componenti.
Componente di feedback
Un componente di feedback reattivo che incorpora microinterazioni con animazioni coinvolgenti. È progettato per supportare la modalità oscura e presenta elementi per il feedback degli utenti con immagini segnaposto e avatar.