Composant de plan du site
Un composant de plan de site de style rétro/vintage avec des effets réactifs et une prise en charge du thème sombre.
HTML Code
<div class="bg-white dark:bg-gray-800 p-6 rounded-lg shadow-md max-w-3xl mx-auto mt-10">
<h2 class="text-2xl font-bold text-center text-gray-800 dark:text-gray-200 mb-4">Site Map</h2>
<ul class="space-y-4">
<li class="bg-gray-100 dark:bg-gray-700 p-4 rounded-md flex items-center justify-between">
<div class="flex items-center">
<img src="https://picsum.photos/40/40" alt="Avatar" class="rounded-full mr-3">
<span class="text-gray-600 dark:text-gray-300">Home</span>
</div>
<a href="#" class="text-blue-500 hover:text-blue-600 dark:hover:text-blue-400">Visit</a>
</li>
<li class="bg-gray-100 dark:bg-gray-700 p-4 rounded-md flex items-center justify-between">
<div class="flex items-center">
<img src="https://picsum.photos/40/40" alt="Avatar" class="rounded-full mr-3">
<span class="text-gray-600 dark:text-gray-300">About Us</span>
</div>
<a href="#" class="text-blue-500 hover:text-blue-600 dark:hover:text-blue-400">Visit</a>
</li>
<li class="bg-gray-100 dark:bg-gray-700 p-4 rounded-md flex items-center justify-between">
<div class="flex items-center">
<img src="https://picsum.photos/40/40" alt="Avatar" class="rounded-full mr-3">
<span class="text-gray-600 dark:text-gray-300">Services</span>
</div>
<a href="#" class="text-blue-500 hover:text-blue-600 dark:hover:text-blue-400">Visit</a>
</li>
<li class="bg-gray-100 dark:bg-gray-700 p-4 rounded-md flex items-center justify-between">
<div class="flex items-center">
<img src="https://picsum.photos/40/40" alt="Avatar" class="rounded-full mr-3">
<span class="text-gray-600 dark:text-gray-300">Contact</span>
</div>
<a href="#" class="text-blue-500 hover:text-blue-600 dark:hover:text-blue-400">Visit</a>
</li>
</ul>
</div>Composants associés
Composant de plan du site
Un composant de plan de site réactif conçu en mode sombre à l’aide de Tailwind CSS.
Composant de plan du site
Un composant de plan de site réactif conçu pour le mode sombre utilisant des couleurs pastel, adapté aux tableaux de bord.
Composant de plan du site
Un composant de plan de site réactif conçu dans un style brutaliste avec un thème sombre pour les sites Web d’entreprise, intégrant des fonctionnalités interactives.