mirror of
https://github.com/placeAtlas/atlas.git
synced 2024-06-10 07:19:26 +02:00
Add header announcement system
This commit is contained in:
parent
34a3619387
commit
4dd01b8431
|
@ -524,3 +524,19 @@ function updateAtlasAll(atlas = atlasAll) {
|
|||
}
|
||||
return atlas
|
||||
}
|
||||
|
||||
// Announcement system
|
||||
|
||||
const announcementEl = document.querySelector("#headerAnnouncement")
|
||||
const announcementButton = announcementEl.querySelector('[role=button]')
|
||||
const announcementText = announcementEl.querySelector('p').textContent.trim()
|
||||
|
||||
if (announcementText && announcementText !== window.localStorage.getItem('announcement-closed')) {
|
||||
announcementButton.click()
|
||||
document.querySelector('#objectsList').style.marginTop = '2.8rem'
|
||||
}
|
||||
|
||||
announcementEl.querySelector('[role=button]').addEventListener('click', () => {
|
||||
window.localStorage.setItem('announcement-closed', announcementText)
|
||||
document.querySelector('#objectsList').style.marginTop = '0'
|
||||
})
|
||||
|
|
|
@ -106,7 +106,15 @@
|
|||
</head>
|
||||
<body>
|
||||
<div id="wrapper" class="listHidden">
|
||||
<nav id="main-navbar" class="navbar navbar-expand-md fixed-top bg-body border-bottom">
|
||||
<header class="fixed-top">
|
||||
<aside class="container-fluid alert-primary collapse" id="headerAnnouncement">
|
||||
<div class="d-flex w-100 py-2 align-items-center">
|
||||
<i class="bi bi-info-circle-fill fs-5"></i>
|
||||
<p class="mb-0 flex-grow-1 px-2"> The 2023 edition of r/place is currently underway, and we are back! Check out <a class="alert-link" href="https://2023.place-atlas.stefanocoding.me">The 2023 r/place Atlas</a>!</p>
|
||||
<a class="fs-5" data-bs-toggle="collapse" href="#headerAnnouncement" role="button" aria-expanded="false" aria-controls="headerAnnouncement"><i class="bi bi-x-lg"></i></a>
|
||||
</div>
|
||||
</aside>
|
||||
<nav id="main-navbar" class="navbar navbar-expand-md bg-body border-bottom">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand text-body d-flex align-items-center" href="./">
|
||||
<picture>
|
||||
|
@ -153,6 +161,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<div id="container">
|
||||
<div id="loading" class="d-flex justify-content-center">
|
||||
<div id="loadingContent" class="my-auto mx-3 text-center text-white">
|
||||
|
|
Loading…
Reference in a new issue