39 lines
1.2 KiB
HTML
39 lines
1.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ru">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
<title>Календарь дней</title>
|
|
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>📅</text></svg>">
|
|
<link rel="stylesheet" href="style.css">
|
|
</head>
|
|
<body>
|
|
|
|
<main class="wrap">
|
|
<header class="top">
|
|
<h1>Календарь дней</h1>
|
|
<p class="sub">Листай месяцы стрелками, сегодняшний день отмечен</p>
|
|
</header>
|
|
|
|
<section class="cal">
|
|
<div class="cal-head">
|
|
<button class="arrow" id="prev" aria-label="Предыдущий месяц">←</button>
|
|
<div class="month-name" id="monthName"></div>
|
|
<button class="arrow" id="next" aria-label="Следующий месяц">→</button>
|
|
</div>
|
|
|
|
<div class="weekdays" id="weekdays"></div>
|
|
<div class="grid" id="grid"></div>
|
|
|
|
<div class="cal-foot">
|
|
<button class="today-btn" id="today">Сегодня</button>
|
|
</div>
|
|
</section>
|
|
|
|
<p class="hint" id="hint">Нажми на любой день, чтобы увидеть дату</p>
|
|
</main>
|
|
|
|
<script src="script.js"></script>
|
|
</body>
|
|
</html>
|