SimpleContentDisplay
Un composant d’affichage de contenu simple avec un design réactif et une prise en charge du thème sombre à l’aide de Tailwind CSS.
HTML Code
<div class="container mx-auto p-4 max-w-sm">
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-md overflow-hidden">
<img class="w-full h-48 object-cover" src="https://picsum.photos/seed/123/400/300" alt="Placeholder image">
<div class="p-4">
<h2 class="text-xl font-semibold text-gray-800 dark:text-white mb-2">Article Title</h2>
<p class="text-gray-600 dark:text-gray-300 text-sm leading-relaxed">This is a brief description of the article content. It provides a sneak peek into what the user can expect to read.</p>
<div class="flex items-center mt-4">
<img class="w-8 h-8 rounded-full mr-2" src="https://randomuser.me/api/portraits/men/1.jpg" alt="Author avatar">
<span class="text-gray-700 dark:text-gray-400 text-sm">John Doe</span>
</div>
</div>
</div>
</div>
Composants associés
Composants d’affichage de contenu Composant 11
Un composant d’affichage de contenu de style rétro/vintage présentant des designs nostalgiques des années 80/90, avec des effets réactifs et une prise en charge du thème sombre.
Composant d’affichage du contenu
Un composant d’affichage de contenu réactif avec un style de design minimaliste et plat, idéal pour les blogs et la consommation de contenu. Il a une palette de couleurs en niveaux de gris et est équipé d’éléments interactifs tout en prenant en charge le mode sombre.
Composant d’affichage du contenu
Un composant d’affichage nostalgique au design rétro, avec des effets réactifs et une prise en charge du thème sombre.