head
<!-- Mid-month Billing Reminder banner (15–18) - adaptive sizing for Amplify vs Classic -->
<script>
document.addEventListener("DOMContentLoaded", function () {
const startDay = 1;
const endDay = 18;
const now = new Date();
const day = now.getDate();
if (day < startDay || day > endDay) return;
const key = `dwaBillingBannerDismissed-${now.getFullYear()}-${now.getMonth()+1}`;
if (localStorage.getItem(key) === "true") return;
const BANNER_ID = "dwa-billing-banner";
if (document.getElementById(BANNER_ID)) return; // prevent duplicates
function isAdminEditingView() {
return window.location.hash && window.location.hash.includes("/settings/");
}
function getAdminOffsetPx() {
return isAdminEditingView() ? 72 : 0;
}
// Detect Amplify-ish pages (best effort)
function isAmplifyPage() {
return !!(
document.querySelector(".amplify-html-embed-container") ||
document.querySelector(".amplify-section-container") ||
document.querySelector(".amplify-container") ||
document.querySelector("#app .amplify-container") ||
document.body.className.toLowerCase().includes("amplify")
);
}
const amplify = isAmplifyPage();
// Size presets:
// - Amplify: smaller so it doesn't feel huge on the homepage
// - Classic: bigger for internal pages readability
const sizes = amplify
? {
title: "clamp(1.05rem, 1.6vw, 1.25rem)",
msg: "clamp(1.00rem, 1.7vw, 1.18rem)",
btn: "clamp(.95rem, 1.5vw, 1.05rem)",
padY: "14px"
}
: {
title: "clamp(1.2rem, 2.4vw, 1.55rem)",
msg: "clamp(1.1rem, 2.6vw, 1.4rem)",
btn: "clamp(1.0rem, 2.0vw, 1.15rem)",
padY: "18px"
};
const banner = document.createElement("div");
banner.id = BANNER_ID;
banner.setAttribute("role", "region");
banner.setAttribute("aria-label", "Billing reminder");
banner.style.position = "sticky";
banner.style.top = getAdminOffsetPx() + "px";
banner.style.zIndex = "4000"; // keep below admin overlay
banner.style.background = "#14558E";
banner.style.color = "#ffffff";
banner.style.padding = `${sizes.padY} 16px`;
banner.style.display = "block";
const inner = document.createElement("div");
inner.style.maxWidth = "1200px";
inner.style.margin = "0 auto";
inner.style.display = "flex";
inner.style.flexWrap = "wrap";
inner.style.gap = "14px";
inner.style.alignItems = "center";
inner.style.justifyContent = "space-between";
const textWrap = document.createElement("div");
textWrap.style.display = "flex";
textWrap.style.flexDirection = "column";
textWrap.style.gap = "4px";
textWrap.style.maxWidth = "920px";
const title = document.createElement("strong");
title.textContent = "Billing Reminder";
title.style.fontSize = sizes.title;
title.style.lineHeight = "1.25";
title.style.letterSpacing = ".01em";
const msg = document.createElement("span");
msg.style.fontSize = sizes.msg;
msg.style.lineHeight = "1.35";
msg.style.fontWeight = "600";
msg.innerHTML = `Payments due soon. Avoid late fees and pay online in minutes.
<a href="/pay-my-bill" style="color:#fff; text-decoration: underline; font-weight:900;">Pay My Bill</a>`;
textWrap.appendChild(title);
textWrap.appendChild(msg);
const btn = document.createElement("button");
btn.type = "button";
btn.setAttribute("aria-label", "Dismiss billing reminder");
btn.textContent = "Dismiss";
btn.style.background = "transparent";
btn.style.color = "#ffffff";
btn.style.border = "2px solid #ffffff";
btn.style.borderRadius = "12px";
btn.style.padding = amplify ? "10px 12px" : "12px 16px";
btn.style.fontWeight = "900";
btn.style.cursor = "pointer";
btn.style.fontSize = sizes.btn;
btn.style.whiteSpace = "nowrap";
btn.addEventListener("focus", function () {
btn.style.outline = "3px solid #0B1F33";
btn.style.outlineOffset = "3px";
});
btn.addEventListener("blur", function () {
btn.style.outline = "none";
});
btn.addEventListener("click", function () {
localStorage.setItem(key, "true");
banner.remove();
});
inner.appendChild(textWrap);
inner.appendChild(btn);
banner.appendChild(inner);
document.body.prepend(banner);
function updateBannerOffset() {
const el = document.getElementById(BANNER_ID);
if (!el) return;
el.style.top = getAdminOffsetPx() + "px";
}
window.addEventListener("hashchange", updateBannerOffset);
window.addEventListener("resize", updateBannerOffset);
});
</script>
<!-- sticky nav -->
<script>
document.addEventListener('DOMContentLoaded', function () {
const links = document.querySelectorAll('a.btn-pill[href="/upcoming-events"]');
links.forEach(link => {
if (link.textContent.trim() === 'View Board Meetings') {
link.textContent = 'View more';
}
});
});
</script>
<script>
(function () {
var ROOT = '.amplify-carousel-container.section-instance-7e3be00f-3b35-4830-b8bc-f90717c6f5ba';
var FIRST_SECTION = '.amplify-section-instance';
var WAVE_ID = 'carousel-bleed-wave';
var D = 'M681.358 99.6025C419.811 130.111 119.139 45.2462 -0.00375175 0L-0.00390625 110H1597.67H1685.33H1773V109V47.7646C1253.91 -13.3418 965.155 66.4982 681.358 99.6025Z';
function makeWave() {
var ns='http://www.w3.org/2000/svg';
var svg=document.createElementNS(ns,'svg');
svg.id=WAVE_ID;
svg.setAttribute('viewBox','0 0 1773 110');
svg.setAttribute('preserveAspectRatio','none'); // <- stretches full width
svg.setAttribute('aria-hidden','true');
svg.setAttribute('focusable','false');
// full-bleed, pinned to bottom of the carousel
svg.style.position='absolute';
svg.style.left='0';
svg.style.right='0';
svg.style.bottom='-1px'; // tuck seam
svg.style.width='100%';
svg.style.height='110px'; // matches viewBox height; adjust if needed
svg.style.display='block';
svg.style.pointerEvents='none';
svg.style.zIndex='3';
var path=document.createElementNS(ns,'path');
path.setAttribute('d', D);
path.setAttribute('fill', '#1978BE'); // required color
svg.appendChild(path);
return svg;
}
function inject() {
var container=document.querySelector(ROOT);
if(!container) return false;
// ensure positioning context
if(getComputedStyle(container).position==='static'){
container.style.position='relative';
}
// remove any previous wave(s)
container.querySelectorAll('#'+CSS.escape(WAVE_ID)).forEach(function(n){ n.remove(); });
var wave=makeWave();
// insert at the root, *before* the first .amplify-section-instance,
// NOT inside the inner .container with padding
var firstSection=container.querySelector(FIRST_SECTION);
if(firstSection){
container.insertBefore(wave, firstSection);
} else {
container.appendChild(wave);
}
return true;
}
if(!inject()){
var mo=new MutationObserver(function(){ if(inject()) mo.disconnect(); });
mo.observe(document.documentElement,{childList:true,subtree:true});
setTimeout(function(){ mo.disconnect(); }, 8000);
}
})();
</script>
<style>
/* Avoid a black bar overlapping; push the next section if needed */
.amplify-carousel-container.section-instance-7e3be00f-3b35-4830-b8bc-f90717c6f5ba + .amplify-section-instance {
margin-top: 0; /* adjust only if you see a gap/overlap */
}
/* If the carousel has a bottom overlay, keep it below the wave */
.amplify-carousel-container .overlay-container { z-index: 1; }
#carousel-bleed-wave { z-index: 3; }
/* push wave down a bit so it doesn't sit tight under the button */
#carousel-bleed-wave {
margin-top: 3rem; /* adjust to taste (e.g. 1.5rem = ~24px) */
}
.splide__slide .carousel-slide-content a .btn-pill {
margin-top: 1.5rem;
color: #fff;
border-color: #fff;
margin-bottom: .75rem !important;
}
</style>
<!-- change defaut loading status in submissions dashboard -->
<script>
(function () {
function isFormSubmissionsPage() {
return window.location.hash === '#/form-submissions';
}
function setStatusToAll() {
if (!isFormSubmissionsPage()) return;
const statusSelect = document.querySelector('#submissionStatus');
if (!statusSelect) return;
if (statusSelect.value === '0') {
statusSelect.value = '';
statusSelect.dispatchEvent(new Event('input', { bubbles: true }));
statusSelect.dispatchEvent(new Event('change', { bubbles: true }));
}
}
// Check after full page load
window.addEventListener('load', function () {
setTimeout(setStatusToAll, 500);
setTimeout(setStatusToAll, 1500);
setTimeout(setStatusToAll, 3000);
});
// Check when hash route changes
window.addEventListener('hashchange', function () {
setTimeout(setStatusToAll, 500);
setTimeout(setStatusToAll, 1500);
});
// Check when Angular/admin content renders dynamically
const observer = new MutationObserver(function () {
setStatusToAll();
});
observer.observe(document.body, {
childList: true,
subtree: true
});
})();
</script>
