Composant Flux d’activités
Flux d’activité Minimaliste/Design plat pour E-commerce, Monochrome, Simple, Réactif, Thème sombre
HTML Code
<div class="bg-white dark:bg-gray-800 p-4 rounded-lg shadow-md">
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">Activity Feed</h3>
<ul class="divide-y divide-gray-200 dark:divide-gray-700">
<li class="py-3 flex items-center justify-between">
<div class="flex items-center">
<img class="h-8 w-8 rounded-full object-cover mr-3" src="https://randomuser.me/api/portraits/men/32.jpg" alt="User Avatar">
<p class="text-sm text-gray-600 dark:text-gray-300">
<span class="font-medium text-gray-900 dark:text-white">John Doe</span> placed an order.
</p>
</div>
<span class="text-xs text-gray-400 dark:text-gray-500">2 hours ago</span>
</li>
<li class="py-3 flex items-center justify-between">
<div class="flex items-center">
<img class="h-8 w-8 rounded-full object-cover mr-3" src="https://randomuser.me/api/portraits/women/44.jpg" alt="User Avatar">
<p class="text-sm text-gray-600 dark:text-gray-300">
<span class="font-medium text-gray-900 dark:text-white">Jane Smith</span> reviewed a product.
</p>
</div>
<span class="text-xs text-gray-400 dark:text-gray-500">5 hours ago</span>
</li>
<li class="py-3 flex items-center justify-between">
<div class="flex items-center">
<img class="h-8 w-8 rounded-full object-cover mr-3" src="https://randomuser.me/api/portraits/men/55.jpg" alt="User Avatar">
<p class="text-sm text-gray-600 dark:text-gray-300">
<span class="font-medium text-gray-900 dark:text-white">Robert Brown</span> added item to cart.
</p>
</div>
<span class="text-xs text-gray-400 dark:text-gray-500">10 hours ago</span>
</li>
</ul>
</div>Composants associés
Flux d’activités Composante 41
Un composant de flux d’activité réactif avec un style de conception 3D, intégrant des effets de profondeur et la prise en charge des thèmes sombres, construit avec Tailwind CSS.
Composant Flux d’activités
Composant de flux d’activités réactif avec un style de conception neumorphique, prenant en charge les thèmes clairs et sombres.
Composant Flux d’activités
Un composant de flux d’activité de style brutaliste avec un design réactif, des mises en page à contraste élevé et une prise en charge du mode sombre à l’aide de Tailwind CSS.