Embed

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SBWPC 2026 Election Alert Bar</title>
<style>
:root{--navy:#102A43;--blue:#D9EEF7;--orange:#F47C48;--white:#FFFFFF}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,Lato,Arial,sans-serif}
.sbwpc-election-alert{position:relative;z-index:9999;width:100%;background:var(--navy);color:var(--white);border-bottom:5px solid var(--orange);box-shadow:0 4px 14px rgba(16,42,67,.18)}
.sbwpc-alert-inner{width:min(1200px,100%);min-height:72px;margin:0 auto;padding:11px 22px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:20px}
.sbwpc-alert-label{display:inline-flex;align-items:center;gap:9px;white-space:nowrap;font-size:.78rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
.sbwpc-alert-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:var(--orange);color:var(--navy);font-size:1.05rem}
.sbwpc-alert-message{min-width:0}
.sbwpc-alert-headline{margin:0;color:var(--white);font-size:clamp(.98rem,1.6vw,1.2rem);font-weight:850;line-height:1.25}
.sbwpc-alert-countdown{margin-top:3px;color:var(--blue);font-size:.84rem;font-weight:700;line-height:1.3}
.sbwpc-alert-action{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 17px;border:2px solid var(--white);border-radius:999px;background:var(--white);color:var(--navy);font-size:.86rem;font-weight:900;text-decoration:none;white-space:nowrap;transition:transform 160ms ease,background-color 160ms ease}
.sbwpc-alert-action:hover{transform:translateY(-1px);background:var(--blue)}
.sbwpc-alert-action:focus-visible,.sbwpc-alert-control:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
.sbwpc-alert-control{position:absolute;right:7px;bottom:-31px;width:30px;height:30px;border:0;border-radius:0 0 8px 8px;background:var(--navy);color:var(--white);cursor:pointer;font-size:1rem;font-weight:900}
.sbwpc-alert-progress{position:absolute;left:0;bottom:-5px;width:0;height:5px;background:var(--blue)}
.sbwpc-election-alert.is-collapsed .sbwpc-alert-inner,.sbwpc-election-alert.is-collapsed .sbwpc-alert-progress{display:none}
.sbwpc-election-alert.is-collapsed{min-height:0;border-bottom:0}
@media (prefers-reduced-motion:no-preference){.sbwpc-alert-progress.is-running{animation:sbwpcProgress 7s linear forwards}@keyframes sbwpcProgress{from{width:0}to{width:100%}}}
@media (max-width:760px){.sbwpc-alert-inner{min-height:0;grid-template-columns:1fr auto;gap:10px 14px;padding:13px 16px}.sbwpc-alert-label{grid-column:1/-1;font-size:.72rem}.sbwpc-alert-icon{width:29px;height:29px}.sbwpc-alert-action{padding:10px 13px;font-size:.78rem}}
@media (max-width:480px){.sbwpc-alert-inner{display:flex;flex-wrap:wrap}.sbwpc-alert-label,.sbwpc-alert-message,.sbwpc-alert-action{width:100%}.sbwpc-alert-action{margin-top:2px}}
</style>
</head>
<body>
<section class="sbwpc-election-alert" id="sbwpcElectionAlert" role="region" aria-label="Important 2026 election information">
  <div class="sbwpc-alert-inner">
    <div class="sbwpc-alert-label">
      <span class="sbwpc-alert-icon" aria-hidden="true">✓</span>
      <span>2026 Election Alert</span>
    </div>
    <div class="sbwpc-alert-message" aria-live="polite" aria-atomic="true">
      <p class="sbwpc-alert-headline" id="sbwpcAlertHeadline">November 3 General Election</p>
      <div class="sbwpc-alert-countdown" id="sbwpcAlertCountdown">Loading the next important deadline…</div>
    </div>
    <a class="sbwpc-alert-action" href="https://santabarbaraca.gov/government/city-hall/elections" target="_blank" rel="noopener noreferrer">See Important Dates&nbsp;→</a>
  </div>
  <div class="sbwpc-alert-progress" id="sbwpcAlertProgress" aria-hidden="true"></div>
  <button class="sbwpc-alert-control" id="sbwpcAlertControl" type="button" aria-expanded="true" aria-label="Collapse election alert">×</button>
</section>
<script>
(function(){
const bar=document.getElementById("sbwpcElectionAlert");
const headline=document.getElementById("sbwpcAlertHeadline");
const countdown=document.getElementById("sbwpcAlertCountdown");
const progress=document.getElementById("sbwpcAlertProgress");
const control=document.getElementById("sbwpcAlertControl");
if(!bar||!headline||!countdown||!progress||!control)return;
const milestones=[
{title:"Candidate filing closes Friday, August 7 at 5:00 PM",date:"2026-08-07T17:00:00-07:00",label:"candidate filing closes"},
{title:"Voter Information Guides begin mailing September 24",date:"2026-09-24T00:00:00-07:00",label:"Voter Information Guides begin mailing"},
{title:"Vote-by-mail ballots begin mailing October 5",date:"2026-10-05T00:00:00-07:00",label:"vote-by-mail begins"},
{title:"The voter registration deadline is October 19",date:"2026-10-19T23:59:59-07:00",label:"the voter registration deadline"},
{title:"Conditional voter registration begins October 20",date:"2026-10-20T00:00:00-07:00",label:"conditional voter registration begins"},
{title:"Election Day is Tuesday, November 3",date:"2026-11-03T20:00:00-08:00",label:"polls close on Election Day"}];
let index=0,timer;
function active(){const now=Date.now();return milestones.filter(x=>new Date(x.date).getTime()>now)}
function remaining(date){const d=new Date(date).getTime()-Date.now();if(d<=0)return"This deadline has arrived.";const days=Math.floor(d/86400000),hours=Math.floor((d%86400000)/3600000),mins=Math.floor((d%3600000)/60000);if(days>=2)return days+" days remaining";if(days===1)return"1 day and "+hours+" hours remaining";if(hours>=1)return hours+" hours and "+mins+" minutes remaining";return Math.max(mins,1)+" minutes remaining"}
function special(){const now=new Date(),start=new Date("2026-11-03T00:00:00-08:00"),end=new Date("2026-11-03T20:00:00-08:00");if(now>=start&&now<=end)return{title:"Election Day is today — polls close at 8:00 PM",sub:"Make your plan to vote and confirm your voting location."};if(now>end)return{title:"Thank you for participating in the 2026 General Election",sub:"Visit SBWPC for election updates and community action."};return null}
function restart(){progress.classList.remove("is-running");void progress.offsetWidth;progress.classList.add("is-running")}
function render(){const s=special();if(s){headline.textContent=s.title;countdown.textContent=s.sub;progress.classList.remove("is-running");return}const list=active();if(!list.length)return;if(index>=list.length)index=0;const item=list[index];headline.textContent=item.title;countdown.textContent=remaining(item.date)+" until "+item.label+".";restart()}
function rotate(){const list=active();if(list.length>1){index=(index+1)%list.length;render()}}
function start(){clearInterval(timer);timer=setInterval(rotate,7000)}
control.addEventListener("click",function(){const collapsed=bar.classList.toggle("is-collapsed");control.textContent=collapsed?"!":"×";control.setAttribute("aria-expanded",String(!collapsed));control.setAttribute("aria-label",collapsed?"Open election alert":"Collapse election alert");if(collapsed)clearInterval(timer);else{render();start()}})
render();start();setInterval(render,60000);
})();
</script>
</body>
</html>

Banner carousel full

A non-partisan political action committee, we endorse candidates who align with our positions and advocate for a feminist agenda. We are committed to social action against discrimination based on gender, race, ethnicity, sexual orientation, gender identity, religion, age, or ability. 

Who We Are

Image

Santa Barbara Women's Political Committee

The Santa Barbara Women’s Political Committee (SBWPC) is a non‑partisan political action committee based in Santa Barbara County, United States, that advances inclusive, intersectional and progressive feminist values. Guided by these principles, SBWPC endorses candidates who support its feminist agenda and work to combat discrimination based on gender, race, ethnicity, sexual orientation, gender identity, religion, age or ability. The organization focuses on social action and advocacy to promote equity and representation. 