Componente di feedback 23
Un componente di feedback progettato in stile Material Design, con animazioni reattive e supporto per temi scuri, costruito con Tailwind CSS.
Codice HTML
<div class="bg-white dark:bg-gray-800 p-6 rounded-lg shadow-md max-w-md mx-auto transition duration-300 ease-in-out transform hover:scale-105">
<div class="flex items-center mb-4">
<img src="https://randomuser.me/api/portraits/men/32.jpg" alt="User Avatar" class="w-10 h-10 rounded-full mr-3 border-2 border-gray-300 dark:border-gray-600">
<div>
<h3 class="font-semibold text-gray-800 dark:text-gray-200">John Doe</h3>
<p class="text-sm text-gray-600 dark:text-gray-400">2 hours ago</p>
</div>
</div>
<p class="text-gray-700 dark:text-gray-300 mb-4">This is an example feedback component for showcasing how user feedback can be displayed using Material Design principles. It supports dark mode with Tailwind CSS.</p>
<img src="https://picsum.photos/200/100" alt="Feedback Image" class="w-full rounded-md mb-4">
<div class="flex justify-between">
<button class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline transition duration-200 ease-in-out">Like</button>
<button class="bg-gray-300 dark:bg-gray-600 hover:bg-gray-400 dark:hover:bg-gray-500 text-gray-800 dark:text-gray-200 font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline transition duration-200 ease-in-out">Reply</button>
</div>
</div>Componenti correlati
Componente Componenti di feedback
Semplice componente di feedback Glassmorphism per i social media, con una combinazione di colori triadica, un design reattivo e il supporto per temi scuri. Non è richiesto alcun JavaScript.
Memphis_Social_Media_Feedback_Component
Un componente di feedback sui social media semplice e reattivo con l'influenza del design Memphis utilizzando neutri caldi, con un pulsante Mi piace e un indicatore di commento. Supporta la modalità oscura.
Componente Componenti di feedback
Una sezione di feedback e testimonianze complessa e reattiva per siti Web aziendali/aziendali, progettata con un'interfaccia utente in modalità scura e una combinazione di colori pastello. Include più elementi interattivi come testimonianze, un modulo di contatto e una visualizzazione delle valutazioni.