Компонент оповещения об истечении времени ожидания сеанса
Минималистичный компонент оповещения об истечении времени ожидания сессии для веб-сайтов электронной коммерции, разработанный с монохроматической цветовой схемой и адаптивный с поддержкой темной темы с использованием Tailwind CSS.
HTML-код
<div class="fixed inset-0 flex items-center justify-center bg-gray-800 bg-opacity-90 dark:bg-gray-900">
<div class="max-w-sm w-full bg-gray-200 dark:bg-gray-700 rounded-lg shadow-lg p-5">
<h2 class="text-xl font-semibold text-gray-900 dark:text-gray-100 mb-2">Session Timeout Warning</h2>
<p class="text-gray-700 dark:text-gray-300 mb-4">Your session is about to expire due to inactivity. Please take action to continue your shopping experience. </p>
<div class="flex justify-between">
<button class="bg-gray-300 dark:bg-gray-600 text-gray-900 dark:text-gray-100 font-semibold py-2 px-4 rounded hover:bg-gray-400 dark:hover:bg-gray-500 transition">Stay Logged In</button>
<button class="bg-red-500 dark:bg-red-700 text-white font-semibold py-2 px-4 rounded hover:bg-red-600 dark:hover:bg-red-800 transition">Log Out</button>
</div>
</div>
</div>Связанные компоненты
Компонент оповещения об истечении времени ожидания сеанса
Компонент оповещения об истечении времени ожидания сеанса, который запускает увлекательную анимацию. Он отличается адаптивным дизайном, подходит для дашбордов с пастельной цветовой гаммой и поддержкой темных тем. Он включает в себя интерактивные элементы, позволяющие пользователям продлить свою сессию или выйти из системы.
Компонент оповещения об истечении времени ожидания сеанса
Простой, понятный и профессиональный компонент оповещения об истечении времени ожидания сеанса, разработанный для платформ вакансий/карьеры. Использует аналогичную цветовую схему и поддерживает темный режим.
Компонент оповещения об истечении времени ожидания сеанса
Компонент оповещения об истечении времени ожидания сеанса, выполненный в брутальном стиле с грубой, смелой эстетикой, высокой контрастностью и отзывчивыми эффектами. Этот компонент поддерживает темную тему с использованием стилизации Tailwind CSS и использует изображения-заполнители из picsum.photos и randomuser.me.