Общая хронология

hide-autor [html]<style>
/**шрифт**/
@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

/**общий блок**/
.stargs {background: #dbd0b9; width: 692px; height: auto; border-radius: 20px; display: flex; flex-wrap: wrap; gap: 10px; padding: 15px; box-sizing: border-box; text-align: left; margin: 0 auto !important;}

/**блок с названием**/
.topst {display: flex; width: 100%; height: 50px; align-items: center; gap: 15px; border-bottom: solid 3px #000;}

/**блок с названием -> звездочка**/
.ist {width: 30px; height: 30px; transition: all 0.7s linear 0s;}
.ist:hover {transform: rotate(90deg); transition: all 0.7s linear 0s;}

/**блок с названием -> название форума**/
.namest {font-family: rubik; font-weight: 600; font-size: 22px; color: #000;}

/**блок с картинкой и инфой**/
.bottomst {display: flex; gap: 15px;}

/**блок с картинкой и инфой -> картинка**/
.imgst img {border-radius: 20px; max-width: 160px;}

/**блок с картинкой и инфой -> инфа**/
.bottomst_r p {margin: 0; font-size: 14px; font-family: 'Rubik'; color: #000; padding-bottom: 10px;}

/**блок с картинкой и инфой -> спойлеры**/
.bottomst_r details {padding: 10px 0; border-top: solid 3px #000; border-bottom: solid 3px #000;}
.bottomst_r details:nth-child(2) {border-bottom: none;}

/**блок с картинкой и инфой -> убираем дефолтные маркеры**/
.bottomst_r details summary::-webkit-details-marker {display: none}
.bottomst_r details > summary {list-style: none;}

/**блок с картинкой и инфой -> название спойлера**/
.bottomst_r summary {cursor: pointer; display: flex; align-items: center; gap: 10px; font-family: 'Rubik'; font-size: 18px; font-weight: 700; color: #000;}
/**блок с картинкой и инфой -> звездочки в спойлерах**/
.bottomst_r summary img {width: 30px; height: 30px;}

/**блок с картинкой и инфой -> списки**/
.bottomst_r details ul {margin: 0; padding: 5px 15px;}
.bottomst_r details li {font-size: 10px; font-family: 'Rubik'; color: #000; list-style: none; line-height: 1.5;}

/**блок с картинкой и инфой -> ссылки в списках**/
.bottomst_r details li a {padding: 0 10px; background: #000; border-radius: 15px; color: #fff !important; text-decoration: none !important; font-family: 'Rubik' !important; font-size: 10px !important; transition: all 0.3s linear 0s;}

/**блок с картинкой и инфой -> навигация**/
.navst {display: flex; flex-wrap: wrap; gap: 10px; padding: 10px 0;}

.navst a {display: block; padding: 5px 10px; background: #000; border-radius: 15px; color: #fff !important; text-decoration: none !important; font-family: 'Rubik' !important; font-size: 10px !important; transition: all 0.3s linear 0s;}
.navst a:hover, .bottomst_r details li a:hover {background: #fff; color: #000 !important; box-sizing: border-box; transition: all 0.3s linear 0s;}

/**блок для хронологии, описание эпизода**/
.bottomst_r post_det {display: block; padding: 5px 5px; font-size:10px;}
</style>

<div class="stargs">
<div class="topst">
<div class="ist"><img src="https://forumstatic.ru/files/0016/f1/95/58840.svg"></div>
<div class="namest">ПРОШЛОЕ</div>
</div>
<div class="bottomst">

</div>
<div class="bottomst_r">

</p>
<p>★ <a class="ep_a" href="https://genshinmemories.rusff.me/viewtopic.php?id=120">In the land of gods and monsters</a> ★
<em>до Войны Архонтов • Ли Юэ • <a href="https://genshinmemories.rusff.me/profile.php?id=3">Morax</a>, <a href="https://genshinmemories.rusff.me/profile.php?id=28">Valefar</a>
<br><post_det>Моракс и Валефар объединяются ради победы над общим врагом.</post_det></em>
</p>

<hr>

<p>★ <a class="ep_a" href="https://genshinmemories.rusff.me/viewtopic.php?id=162">Eye of the Storm</a> ★
<em>490 год • Инадзума • <a href="https://genshinmemories.rusff.me/profile.php?id=19">Il Dottore</a>, <a href="https://genshinmemories.rusff.me/profile.php?id=13">Sengo Muramasa</a><br><post_det>Второй Предвестник и гордый самурай вступают в заговор?</post_det></em>
</p>

<hr>

<p>★ <a class="ep_a" href="https://genshinmemories.rusff.me/viewtopic.php?id=203">Нефрит и золото</a> ★
<em>499 год • Ли Юэ • <a href="https://genshinmemories.rusff.me/profile.php?id=3">Zhongli</a>, <a href="https://genshinmemories.rusff.me/profile.php?id=42">Keqing</a><br><post_det>Нефритовое Равновесие ищет в гавани фальшивомонетчиков, а господин консультант помогает ей.</post_det></em>
</p>

<hr>

<p>★ <a class="ep_a" href="https://genshinmemories.rusff.me/viewtopic.php?id=151">Justice will prevail</a> ★
<em>после катаклизма • Фонтейн • <a href="https://genshinmemories.rusff.me/profile.php?id=4">Furina de Fontaine</a>, <a href="https://genshinmemories.rusff.me/profile.php?id=28">Hong Baoshi</a><br><post_det>Валефар присматривается к новому Архонту, пришедшему на место умершей Эгерии.</post_det></em>

</div>
</div>

<br>

<div class="stargs">
<div class="topst">
<div class="ist"><img src="https://forumstatic.ru/files/0016/f1/95/58840.svg"></div>
<div class="namest">НАСТОЯЩЕЕ</div>
</div>
<div class="bottomst">

</div>
<div class="bottomst_r">

<p>★ <a class="ep_a" href="https://genshinmemories.rusff.me/viewtopic.php?id=218">Наш разум загнивает</a> ★
<em>17.07. • Сумеру • <a href="https://genshinmemories.rusff.me/profile.php?id=41">Laertes</a>, <a href="https://genshinmemories.rusff.me/profile.php?id=34">Johar</a><br><post_det>Встреча учёного и Фатуи - чем же закончится?</post_det></em>
</p>

<hr>

<p>★ <a class="ep_a" href="https://genshinmemories.rusff.me/viewtopic.php?id=217">(не)наблюдательность</a> ★
<em>09.04. • Ли Юэ • <a href="https://genshinmemories.rusff.me/profile.php?id=41">Laertes</a>, <a href="https://genshinmemories.rusff.me/profile.php?id=3">Zhongli</a><br><post_det>Лаэрт решает проверить, с кем же так часто встречается его босс.</post_det></em>
</p>

<hr>

<p>★ <a class="ep_a" href="https://genshinmemories.rusff.me/viewtopic.php?id=35">Каждый шаг оставляет след</a> ★
<em>18.03 • Ли Юэ • <a href="https://genshinmemories.rusff.me/profile.php?id=12">Lumine</a>, <a href="https://genshinmemories.rusff.me/profile.php?id=3">Zhongli</a><br><post_det> Путешественница пробуждается рядом со статуей Архонта и не понимает, что происходит. К счастью, рядом есть тот, кто готов помочь. </post_det></em>
</p>

<hr>

<p>★ <a class="ep_a" href="https://genshinmemories.rusff.me/viewtopic.php?id=199">Старые встречи и новые знакомства</a> ★
<em>501 год • Сумеру • <a href="https://genshinmemories.rusff.me/profile.php?id=17">Alhaitham</a>, <a href="https://genshinmemories.rusff.me/profile.php?id=43">Vasanta</a><br><post_det>Внутренние проблемы Академии.</post_det></em>
</p>
</div>
</div>

[/html]