function displayNewLoginNotice() {
if (window.localStorage.getItem("loginNoticeClosed") == 1) return
const html = `<section class="new-login-notice">
<div>
<span>gear</span>
<p>We're improving our login system and will be updating the look and feel of this page soon</p>
</div>
<button onclick="closeNotice();">X</button>
</section>`
document.body.insertAdjacentHTML("afterbegin", html)
}
function closeNotice() {
document.querySelector(".new-login-notice").style.display = "none"
window.localStorage.setItem("loginNoticeClosed", 1)
}
.boxbox {
}
.boxbox_shadow {
background-color: black;
height: 100%;
left: 0;
opacity: 0.85;
-moz-opacity: 0.85;
-khtml-opacity: 0.85;
filter: alpha(opacity=85);
position: fixed;
top: 0;
width: 100%;
z-index: 900;
}
.boxbox .boxbox_body {
left: 0;
top: 0;
position: absolute;
width: 100%;
z-index: 901;
padding: 50px 0px 0px 0px;
}
body.totale_next .boxbox .boxbox_body {
padding: 90px 0 0 0;
}
.boxbox .boxbox_body.rs4 {
padding: 200px 0px 0px 0px;
}
#broadcast_message {
padding: 10px;
border: 2px solid white;
background-color: black;
width: 500px;
margin: 0 auto;
color: white;
}
#broadcast_message h1 {
color: yellow;
padding-bottom: 10px;
}
#broadcast_message p {
margin-top: 10px;
text-align: left;
}
#broadcast_dismissal {
margin: 20px;
}
section.new-login-notice {
background: yellow;
display: flex;
padding: 20px;
}
section.new-login-notice p { margin: 0; padding: 0 0 0 10px }
section.new-login-notice div {
width: 100%;
display: flex;
justify-content: center;
border: 1px solid red;
}
section.new-login-notice span { background: salmon }
section.new-login-notice button {
padding: 0 10px;
}
@media (max-width: 600px) {
div {
flex-direction: column;
}
span, div {
align-self: center;
}
}