<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Алерт</title>
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="p-6">
<div class="mx-auto max-w-md space-y-3">
<div class="rounded-lg border border-sky-200 bg-sky-50 p-4 text-sky-900" role="status">
<p class="font-semibold">Подсказка</p>
<p class="mt-1 text-sm text-sky-800">Файл сохранён в папку «Загрузки».</p>
</div>
<div class="rounded-lg border border-amber-200 bg-amber-50 p-4 text-amber-900" role="alert">
<p class="font-semibold">Внимание</p>
<p class="mt-1 text-sm">Срок сдачи работы — завтра до 23:59.</p>
</div>
</div>
</body>
</html>
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Алерт</title>
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="p-6">
<div class="mx-auto max-w-md space-y-3">
<div class="rounded-lg border border-sky-200 bg-sky-50 p-4 text-sky-900" role="status">
<p class="font-semibold">Подсказка</p>
<p class="mt-1 text-sm text-sky-800">Файл сохранён в папку «Загрузки».</p>
</div>
<div class="rounded-lg border border-amber-200 bg-amber-50 p-4 text-amber-900" role="alert">
<p class="font-semibold">Внимание</p>
<p class="mt-1 text-sm">Срок сдачи работы — завтра до 23:59.</p>
</div>
</div>
</body>
</html>