Componente Messaggi di errore
Un componente reattivo per i messaggi di errore che utilizza i principi di Material Design, con una combinazione di colori triadica e il supporto della modalità scura, su misura per un portfolio.
Codice HTML
<div class="flex flex-col items-center justify-center p-5 bg-white rounded-lg shadow-md dark:bg-gray-800">
<img src="https://picsum.photos/200/100" alt="Error Image" class="rounded-lg shadow-sm mb-4">
<div class="text-center">
<h2 class="text-lg font-bold text-red-600 dark:text-red-400">Error Occurred!</h2>
<p class="mt-2 text-sm text-gray-600 dark:text-gray-300">Oops! Something went wrong while trying to display the content.</p>
<p class="mt-2 text-sm text-gray-600 dark:text-gray-300">Please try again later or contact support.</p>
<button class="mt-4 px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600 dark:bg-blue-700 dark:hover:bg-blue-800">Retry</button>
</div>
</div>
Componenti correlati
Componente Messaggi di errore
Un componente minimalista per i messaggi di errore progettato utilizzando Tailwind CSS, con effetti reattivi e supporto per temi scuri.
Componente Messaggi di errore
Un componente per i messaggi di errore in stile glassmorphism con un tema scuro per uso aziendale. Utilizza Tailwind CSS per lo styling con un design reattivo ed elementi interattivi.
Componente Messaggi di errore
Componente Messaggi di errore retrò / vintage con una combinazione di colori pastello, layout complesso, design reattivo e supporto per temi scuri utilizzando Tailwind CSS.