Ивент-Календарь
‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑ ‑
2 недели заданий
[html]<style>
.calendar {
display: grid;
grid-template-columns: repeat(7, 1fr);
gap: 10px;
max-width: 1000px;
margin: 0 auto;
cursor: pointer;
font-family: 'Akrobat', sans-serif;
}
.cell {
position: relative;
background: #816f54;
color: #c3b88e;
border-radius: 6px;
height: 120px;
padding: 7px;
overflow: hidden;
display: flex;
text-align: center;
transition: transform 0.2s ease, box-shadow 0.2s ease;
font-size: 1rem;
cursor: pointer;
box-shadow: inset 0px 0px 8px -2px #7d766c54;
flex-direction: column;
justify-content: center;}
.cell a {
color: rgb(229 215 140) !important;
}
.cell:hover {
transform: scale(1.05);
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}
.cell::before {
content: attr(data-day);
position: absolute;
top: 8px;
left: 8px;
font-size: 1.3rem;
color: #aab5a8;
opacity: 0.4;
}
.locked {
background: #745f364a;
color: transparent;
pointer-events: none;
}
.locked::before {
opacity: 0.1;
}
</style>
<body>
<h2>🎮 Календарь Заданий</h2>
<div class="calendar">
<!-- Примерная неделя -->
<div class="cell locked" data-day="27">ТОРЖЕСТВЕННОЕ ОТКРЫТИЕ БАЛА</div>
<div class="cell locked" data-day="28">мудборд «Бальный»</div>
<div class="cell locked" data-day="29">факты: сплетни о персонаже</div>
<div class="cell locked" data-day="30">факты: кем бы был персонаж, если бы он был выходцем из другой страны?</div>
<div class="cell" data-day="31">♦</div>
<div class="cell" data-day="1"><a href="https://phantompact.rusff.me/viewtopic.php?id=172">музыкальная ассоциация</a> на свой регион или страну</div>
<div class="cell" data-day="2">собрать паззл #1</div>
<div class="cell" data-day="3">написать пост</div>
<div class="cell" data-day="4">заполнить мудборд на тему ивента</div>
<div class="cell" data-day="5">решить кроссворд</div>
<div class="cell" data-day="6">☆</div>
<div class="cell" data-day="7">открыть или обновить личную тему в Уголке творца</div>
<div class="cell" data-day="8">решить кроссворд<p><hr><p><img src="https://upforme.ru/uploads/001c/76/35/2/839297.png" alt=""></div>
<div class="cell" data-day="9">нафлудить 100 сообщений</div>
<!-- и так далее -->
<div class="cell" data-day="28">♥</div>
<div class="cell" data-day="29">скинуть ассоциации на 3 персонажей с ролевой</div>
<div class="cell" data-day="30">собрать паззл #1</div>
<div class="cell" data-day="31">♦</div>
<div class="cell" data-day="1">решить второй кроссворд</div>
<div class="cell" data-day="2">★</div>
<div class="cell" data-day="3">завести новый отыгрыш или решить 3ий пазл<p><hr><p><img src="https://upforme.ru/uploads/001c/76/35/2/839297.png" alt=""></div>
</div>
[/html]
