JSFiddle - React, Tailwind, and code Playground
by kthornbloom
JavaScript
if (!sessionStorage.getItem('bannerDisplayed')) {
var banner = "<div style='background: #FFB700; padding: .5rem;text-align: center; font-family: sans-serif; font-size: 14px;'><div style='max-width: 800px; margin:0 auto;'>Our phone service provider is currently experiencing technical difficulties. They are actively working to resolve the issue as quickly as possible. If you need assistance, please use the <a href='/contact-us' style='color: inherit; text-decoration:underline;'>Contact Us</a> form or web chat feature to get in touch with our team. Thank you for your patience!</div></div>";
const header = document.getElementById('responsive-header');
nopHeader = document.querySelector('.is-sticky');
if (header){header.insertAdjacentHTML("afterbegin", banner);}
else if (nopHeader){nopHeader.insertAdjacentHTML("afterbegin", banner);}
sessionStorage.setItem('bannerDisplayed', 'true');
}