喜欢/反应按钮组件
一个复古/年代风格的点赞/反应按钮组件，特色是一系列用于反应的互动按钮，支持深色主题和响应式设计。该组件适合用于仪表盘，使用户能对界面中的各种元素进行反应。
HTML 代码
<div class="bg-gray-900 dark:bg-gray-800 p-5 rounded-lg shadow-lg max-w-lg mx-auto">
<h2 class="text-2xl font-extrabold text-center text-yellow-300 mb-4">React with Nostalgia!</h2>
<div class="flex justify-around mb-4">
<button class="bg-red-500 hover:bg-red-400 text-white font-bold py-2 px-4 rounded-full shadow-lg transition duration-300 ease-in-out transform hover:-translate-y-1">❤️ Like</button>
<button class="bg-blue-500 hover:bg-blue-400 text-white font-bold py-2 px-4 rounded-full shadow-lg transition duration-300 ease-in-out transform hover:-translate-y-1">😂 Haha</button>
<button class="bg-yellow-500 hover:bg-yellow-400 text-white font-bold py-2 px-4 rounded-full shadow-lg transition duration-300 ease-in-out transform hover:-translate-y-1">😢 Sad</button>
<button class="bg-green-500 hover:bg-green-400 text-white font-bold py-2 px-4 rounded-full shadow-lg transition duration-300 ease-in-out transform hover:-translate-y-1">😡 Angry</button>
</div>
<hr class="border-gray-600 mb-4">
<div class="flex items-center justify-center">
<img class="w-12 h-12 rounded-full border-2 border-yellow-300 mr-2" src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar">
<span class="text-lg text-gray-300">John Doe</span>
</div>
<div class="mt-4">
<p class="text-gray-400 text-center">React to the content with your feelings!</p>
</div>
</div>
<div class="bg-gray-900 dark:bg-gray-800 p-5 rounded-lg shadow-lg max-w-lg mx-auto mt-6">
<h3 class="text-xl font-semibold text-center text-yellow-300 mb-4">Select Your Mood</h3>
<div class="grid grid-cols-2 gap-4">
<button class="bg-red-500 hover:bg-red-400 text-white font-bold py-2 rounded-lg shadow-lg transition duration-300">Excited</button>
<button class="bg-blue-500 hover:bg-blue-400 text-white font-bold py-2 rounded-lg shadow-lg transition duration-300">Happy</button>
<button class="bg-yellow-500 hover:bg-yellow-400 text-white font-bold py-2 rounded-lg shadow-lg transition duration-300">Sad</button>
<button class="bg-green-500 hover:bg-green-400 text-white font-bold py-2 rounded-lg shadow-lg transition duration-300">Angry</button>
</div>
</div>