Composant d’alerte de délai d’expiration de session
Un composant réactif d’alerte de délai d’expiration de session conçu avec le style glassmorphism et adapté aux thèmes sombres. Il présente une palette de couleurs pastel, des éléments translucides ressemblant à du verre dépoli avec des effets de flou, et certaines fonctionnalités interactives comme un compte à rebours et des boutons d’action.
HTML Code
<div class="fixed inset-0 flex items-center justify-center bg-gray-900 bg-opacity-70 dark:bg-gray-800 dark:bg-opacity-70">
<div class="bg-white dark:bg-gray-900 backdrop-blur-lg rounded-lg shadow-lg p-6 max-w-sm w-full">
<h2 class="text-center text-xl font-semibold text-gray-700 dark:text-gray-300 mb-4">Session Timeout Alert</h2>
<p class="text-center text-gray-600 dark:text-gray-400 mb-6">Your session will expire in <span id="countdown" class="font-bold text-red-500">05:00</span> minutes.</p>
<div class="flex justify-around mt-4">
<button class="bg-gradient-to-r from-pink-400 to-blue-400 text-white font-medium py-2 px-4 rounded-lg hover:opacity-90 focus:outline-none dark:from-pink-500 dark:to-blue-500">Stay Logged In</button>
<button class="bg-gray-300 text-gray-700 font-medium py-2 px-4 rounded-lg hover:opacity-90 focus:outline-none dark:bg-gray-600 dark:text-gray-200">Logout</button>
</div>
</div>
</div>Composants associés
Composant d’alerte de délai d’expiration de session
Un composant d’alerte de délai d’expiration de session réactif avec un design arc-en-ciel dégradé multicolore, adapté aux sites Web gouvernementaux et de services publics. Dispose d’une prise en charge du mode sombre et de transitions fluides.
Composant d’alerte de délai d’expiration de session
Un composant d’alerte de délai d’expiration de session réactif et compatible avec un thème sombre avec le style Glassmorphism, les tons de terre et la mise en page complexe à l’aide de Tailwind CSS. Comprend des effets de verre givré, du flou et de multiples éléments interactifs adaptés à un portfolio.
Composant d’alerte de délai d’expiration de session
Un composant minimaliste d’alerte de délai d’expiration de session pour les sites Web de commerce électronique, conçu avec une palette de couleurs monochromatique et réactif avec la prise en charge du thème sombre à l’aide de Tailwind CSS.