Back up of header content
<script>
document.addEventListener('DOMContentLoaded', function () {
// Only apply this on pages with an Amplify header
const amplifyHeader = document.querySelector('header.amplify-header');
if (!amplifyHeader) return;
// Create the new top header
const headerBar = document.createElement('header');
headerBar.className = 'header-link-bar';
headerBar.innerHTML = `
<div class="container">
<a href="/employment-opportunities">
<img src="https://streamline.imgix.net/8dd2697a-cbc0-48ff-a9ad-d69c6db53c2a/6713c1d0-2364-4ee2-990c-514b51b38097/309041_users_group_people_icon.png?ixlib=rb-1.1.0&or=0&w=100&h=100&fit=max&auto=format%2Ccompress&s=ee08901cf7fac4112c067c9a701ccac6" alt="">
Join Metro Fire
</a>
<a href="/contact-us">
<img src="https://streamline.imgix.net/8dd2697a-cbc0-48ff-a9ad-d69c6db53c2a/cb5ca832-b8e3-451a-9be6-c452ec222c6b/1566544_address%20book_addresses_business_contact_diary_icon.png?ixlib=rb-1.1.0&or=0&w=100&h=100&fit=max&auto=format%2Ccompress&s=80a7bc857a61023c18c690d6561311f7" alt="">
Contact Us
</a>
</div>
`;
// Insert the new header above the Amplify header
amplifyHeader.parentNode.insertBefore(headerBar, amplifyHeader);
// Add CSS styling
const style = document.createElement('style');
style.textContent = `
.header-link-bar {
position: static;
text-align: right;
color: #fff;
background-color: #4a5361;
padding: 0 15px;
}
.header-link-bar a {
color: #fff;
font-weight: bold;
}
.header-link-bar a:hover,
.header-link-bar a:focus {
color: #e6e6e6;
}
.header-link-bar .container {
display: flex;
height: 48px;
justify-content: flex-end;
align-items: center;
font-size: 14px;
letter-spacing: 0.02em;
}
.header-link-bar .container img {
position: relative;
top: -1px;
height: 18px;
margin-right: 10px;
}
.header-link-bar .container a {
margin-left: 30px;
}
@media (max-width: 767px) {
.header-link-bar .container {
justify-content: center;
}
}
`;
document.head.appendChild(style);
});
</script>
<script>
$(function() {
let signInLink = $('.footer-poweredby a').get(0);
signInLink.text = 'Streamline';
signInLink.href = 'https://www.getstreamline.com';
});
</script>
<style>
.amplify-quicklinks-container .container header {
width: 10rem;}
.amplify-quicklinks-container .container header h3 {text-align: center;}
.amplify-header .container h1 img {height: 7.3rem; padding: 20px 0;}
.amplify-quicklinks-container {padding: 2rem 0 2rem 0;}
.amplify-teasers {padding: 0;}
</style>
