Volet Forum communautaire
Un composant de forum communautaire simple et brutaliste en niveaux de gris pour les médias sociaux, avec un design réactif et une prise en charge du mode sombre.
HTML Code
<div class="bg-white dark:bg-black text-black dark:text-white min-h-screen p-4">
<div class="container mx-auto">
<h1 class="text-2xl font-bold mb-4 text-center">Community Forum</h1>
<div class="space-y-4">
<!-- Forum Post -->
<div class="border border-black dark:border-white p-4">
<div class="flex items-center mb-2">
<img src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar" class="w-8 h-8 rounded-full mr-2 border border-black dark:border-white">
<p class="font-bold">User One</p>
</div>
<p class="mb-2">This is a sample forum post content.</p>
<div class="flex justify-between text-sm text-gray-600 dark:text-gray-400">
<span>Posted on: 2023-10-27</span>
<span>Replies: 5</span>
</div>
</div>
<!-- Forum Post -->
<div class="border border-black dark:border-white p-4">
<div class="flex items-center mb-2">
<img src="https://randomuser.me/api/portraits/women/2.jpg" alt="User Avatar" class="w-8 h-8 rounded-full mr-2 border border-black dark:border-white">
<p class="font-bold">User Two</p>
</div>
<p class="mb-2">Another example forum post here.</p>
<div class="flex justify-between text-sm text-gray-600 dark:text-gray-400">
<span>Posted on: 2023-10-27</span>
<span>Replies: 10</span>
</div>
</div>
<!-- Forum Post -->
<div class="border border-black dark:border-white p-4">
<div class="flex items-center mb-2">
<img src="https://randomuser.me/api/portraits/men/3.jpg" alt="User Avatar" class="w-8 h-8 rounded-full mr-2 border border-black dark:border-white">
<p class="font-bold">User Three</p>
</div>
<p class="mb-2">Yet another example forum post to fill the space.</p>
<div class="flex justify-between text-sm text-gray-600 dark:text-gray-400">
<span>Posted on: 2023-10-27</span>
<span>Replies: 2</span>
</div>
</div>
</div>
</div>
</div>Composants associés
Volet Forum communautaire - Art déco Monochromatique
Un composant de forum communautaire réactif conçu avec une esthétique Art déco utilisant une palette de couleurs monochromatiques, adapté aux applications technologiques/SaaS. Dispose d’une prise en charge du mode sombre et d’éléments interactifs.
Volet Forum communautaire
Un composant de forum communautaire simple et réactif avec une palette de couleurs chaudes, inspirée du coucher de soleil, adapté aux plateformes de rencontres ou sociales. Comprend des ombres de type Material Design et prend en charge le mode sombre.
Volet Forum communautaire
Composant du forum communautaire avec conception Glassmorphism, palette de couleurs vives, niveau de complexité complexe, à des fins de blog/contenu, conception réactive avec prise en charge du thème sombre, utilisation de Tailwind CSS.