Componente de menciones de usuario
Un componente de mención de usuario simple y receptivo con diseño de skeuomorfismo, combinación de colores análoga y compatibilidad con el modo oscuro.
Código HTML
<div class="bg-gray-200 dark:bg-gray-800 p-4 rounded-lg shadow-xl">
<div class="flex items-center mb-4">
<img class="w-10 h-10 rounded-full mr-4 shadow-md" src="https://randomuser.me/api/portraits/men/32.jpg" alt="User Avatar">
<p class="text-gray-800 dark:text-gray-200 font-semibold text-lg">John Doe</p>
</div>
<p class="text-gray-700 dark:text-gray-300">
Mentioned you in a comment:
<span class="text-blue-600 dark:text-blue-400">@JaneSmith</span> This is a great point!
</p>
</div>Componentes relacionados
Componente de menciones de usuario
Un usuario complejo y minimalista menciona un componente diseñado para plataformas educativas, con un esquema de color neón/eléctrico, capacidad de respuesta y compatibilidad con el modo oscuro. Muestra menciones recientes con avatares de usuario, mensajes y marcas de tiempo, incluido un botón 'Ver todo'.
Componente de menciones de usuario
Un componente de menciones de usuario responsivo con soporte para temas oscuros, diseñado para sitios web comerciales. Presenta microinteracciones usando Tailwind CSS y un esquema de color de tono tierra.
Menciones de usuario Componente 15
Un componente web que muestra las menciones del usuario en un estilo de Material Design, con efectos responsivos y compatibilidad con temas oscuros.