Alerte de délai d’expiration de la session
Un composant d’alerte de délai d’expiration de session Material Design simple et monochrome pour les réseaux sociaux, avec un design réactif et une prise en charge du thème sombre.
HTML Code
<div class="fixed inset-0 bg-gray-600 bg-opacity-50 overflow-y-auto h-full w-full">
<div class="relative top-20 mx-auto p-5 border w-96 shadow-lg rounded-md bg-white dark:bg-gray-800">
<div class="mt-3 text-center">
<div class="mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-gray-100 dark:bg-gray-700">
<svg class="h-6 w-6 text-gray-600 dark:text-gray-200" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
</div>
<h3 class="text-lg leading-6 font-medium text-gray-900 dark:text-white mt-4">Session Expiring</h3>
<div class="mt-2 px-7 py-3">
<p class="text-sm text-gray-500 dark:text-gray-300">Your session is about to expire. You will be logged out automatically.</p>
</div>
<div class="items-center px-4 py-3">
<button id="ok-btn" class="px-4 py-2 bg-gray-600 text-white text-base font-medium rounded-md w-full shadow-sm hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-gray-500 dark:bg-gray-700 dark:hover:bg-gray-600 dark:focus:ring-gray-600">OK</button>
</div>
</div>
</div>
</div>Composants associés
Alerte de délai d’expiration de la session
Un composant d’alerte de délai d’expiration de session simple en mode sombre pour les sites de commerce électronique, conçu avec des couleurs pastel et une réactivité à l’aide de TailwindCSS.
Composant d’alerte de délai d’expiration de session
Un composant d’alerte de délai d’expiration de session simple, réactif et monochromatique avec des effets de néon/lueur, conçu pour les plateformes d’éducation/d’apprentissage. Inclut la prise en charge du mode sombre.
Composant d’alerte de délai d’expiration de session
Un composant complexe et réactif d’alerte de délai d’expiration de session pour les sites Web gouvernementaux/de service public, avec un design inspiré de l’agriculture et de la nature avec des neutres froids. Comprend un compte à rebours, des options pour prolonger ou se déconnecter, et une prise en charge complète du mode sombre.