Composant Visionneuse de fichiers
Un composant de visionneuse de fichiers réactif stylisé avec les principes de conception matérielle à l’aide de Tailwind CSS, avec prise en charge du thème sombre.
HTML Code
<div class="bg-white dark:bg-gray-800 shadow rounded-lg p-6 max-w-md mx-auto mt-10">
<h2 class="text-2xl font-bold text-gray-800 dark:text-gray-200 mb-4">File Viewer</h2>
<div class="border-b border-gray-300 dark:border-gray-600 mb-4">
<h3 class="text-xl font-semibold text-gray-700 dark:text-gray-200">Document Title</h3>
<p class="text-gray-600 dark:text-gray-400">Uploaded by: <span class="font-medium">John Doe</span></p>
</div>
<div class="flex flex-col items-center mb-4">
<img src="https://picsum.photos/200/100" alt="File Preview" class="rounded-lg shadow-md mb-4" />
<p class="text-gray-700 dark:text-gray-300 text-center">File Description: This is a placeholder file viewer that shows brief file details and presentation.</p>
</div>
<div class="flex justify-between items-center">
<span class="text-gray-600 dark:text-gray-400">File Size: 2.3 MB</span>
<button class="bg-blue-500 hover:bg-blue-600 text-white font-bold py-2 px-4 rounded shadow">Download</button>
</div>
</div>
Composants associés
Composant Retro File Viewer
Un composant de visionneuse de fichiers complexe et réactif avec une esthétique rétro/vintage des années 80/90, une palette de couleurs neutres chaudes, conçu pour les interfaces finance/banque. Comprend la prise en charge du mode sombre et des éléments interactifs.
Composant Visionneuse de fichiers
Un composant de visionneuse de fichiers de style brutaliste avec un design réactif et une prise en charge du mode sombre à l’aide de Tailwind CSS.
Composant Visionneuse de fichiers
Un composant de visionneuse de fichiers réactif conçu pour les sites Web de commerce électronique en mode sombre avec une palette de couleurs monochromatiques. Il comprend des fonctionnalités interactives telles que le téléchargement et l’aperçu des fichiers.