rentv portal: a11y — add aria-expanded/aria-controls to burger (synced across all close paths), drop dead .brand CSS

0ddefab2c292fbd155514d87a1bd246321d6930e · 2026-07-20 16:12:47 -0700 · Steve Abrams
Files touched

M build.mjs
M public/portal.html
Diff

commit 0ddefab2c292fbd155514d87a1bd246321d6930e
Author: Steve Abrams <steve@designerwallcoverings.com>
Date:   Mon Jul 20 16:12:47 2026 -0700

    rentv portal: a11y — add aria-expanded/aria-controls to burger (synced across all close paths), drop dead .brand CSS
---
 build.mjs          | 8 ++++----
 public/portal.html | 8 ++++----
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/build.mjs b/build.mjs
index c49a103..e9ad14e 100644
--- a/build.mjs
+++ b/build.mjs
@@ -339,8 +339,6 @@ const app = `<!doctype html><html lang="en"><head>
 body{background:var(--bg);color:var(--ink);font-family:'Jost',system-ui,sans-serif;font-size:19px;line-height:1.75;-webkit-font-smoothing:antialiased}
 .disp{font-family:'Cormorant Garamond',Georgia,serif}a{color:inherit;text-decoration:none}
 .bar{position:fixed;top:0;left:0;right:0;z-index:40;display:flex;align-items:center;justify-content:flex-start;padding:18px 34px;background:linear-gradient(180deg,rgba(12,16,22,.94),rgba(12,16,22,0));backdrop-filter:blur(5px)}
-.brand{font-family:'Cormorant Garamond',serif;font-size:20px;letter-spacing:.28em;text-transform:uppercase}.brand span{color:var(--gold)}
-.brand small{display:block;font-family:'Jost';font-size:9px;letter-spacing:.32em;color:var(--gold);margin-top:2px}
 .burger{width:30px;height:20px;position:relative;cursor:pointer;background:none;border:0}.burger span{position:absolute;left:0;right:0;height:1.6px;background:var(--ink);transition:.35s}
 .burger span:nth-child(1){top:1px}.burger span:nth-child(2){top:9px}.burger span:nth-child(3){top:17px}
 body.nav .burger span:nth-child(1){transform:translateY(8px) rotate(45deg)}body.nav .burger span:nth-child(2){opacity:0}body.nav .burger span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
@@ -451,9 +449,9 @@ td.mo{font-family:'Cormorant Garamond',serif;color:var(--gold);font-size:18px;wi
 footer{padding:56px clamp(24px,7vw,120px);border-top:1px solid var(--line);color:var(--dim);font-size:12px;letter-spacing:.14em;text-transform:uppercase;display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px}
 @media(max-width:640px){.heybox{grid-template-columns:1fr}.metrics{gap:26px}}
 </style></head><body>
-<header class="bar"><button class="burger" onclick="document.body.classList.toggle('nav')" aria-label="Menu"><span></span><span></span><span></span></button></header>
+<header class="bar"><button class="burger" onclick="document.body.classList.toggle('nav')" aria-label="Menu" aria-expanded="false" aria-controls="portalmenu"><span></span><span></span><span></span></button></header>
 <div class="scrim" onclick="document.body.classList.remove('nav')"></div>
-<nav class="menu" onclick="if(event.target.tagName==='A')document.body.classList.remove('nav')">
+<nav class="menu" id="portalmenu" onclick="if(event.target.tagName==='A')document.body.classList.remove('nav')">
   <a class="mbrand" href="#summary">REN<span>TV</span>.com<small>Growth Strategy · 2026</small></a>
   <div class="mh">Contents</div>${navLinks}
   <div class="minfo"><div class="mh">RENTV.com, Inc.</div><p>${BIZ.addr}</p>${BIZ.team.map(t=>`<p>${t[0]} — ${t[1]} · ${t[2]}</p>`).join('')}<p><a href="https://rentv.com" target="_blank" rel="noopener">rentv.com ↗</a> · <a href="https://www.rentvreview.com" target="_blank" rel="noopener">The REview ↗</a> · <a href="https://www.linkedin.com/company/rentv.com-inc" target="_blank" rel="noopener">LinkedIn ↗</a></p></div>
@@ -679,6 +677,8 @@ function drawRoad(sec){var rd=sec.querySelector('.road');if(rd)setTimeout(functi
 function setAll(o){accs.forEach(function(s){s.classList.toggle('open',o);var c=s.querySelector('.chev');if(c)c.textContent=o?'\\u2013':'+';if(o)drawRoad(s);});if(o){initCharts();initDesk();}}
 document.getElementById('xall').onclick=function(){setAll(true);};document.getElementById('call').onclick=function(){setAll(false);};
 document.querySelectorAll('.menu a[href^="#"]').forEach(function(a){a.addEventListener('click',function(){var id=a.getAttribute('href').slice(1),s=document.getElementById(id);if(s&&!s.classList.contains('open')&&s.querySelector('.acchead')){s.querySelector('.acchead').click();}if(s)setTimeout(function(){s.scrollIntoView({behavior:'smooth'});},80);});});
+// Keep the burger's aria-expanded in sync with body.nav no matter which path (burger, scrim, or a menu link) toggles it.
+(function(){var burger=document.querySelector('.burger');if(!burger)return;function sync(){burger.setAttribute('aria-expanded',document.body.classList.contains('nav'));}new MutationObserver(sync).observe(document.body,{attributes:true,attributeFilter:['class']});sync();})();
 var io=new IntersectionObserver(function(es){es.forEach(function(e){if(e.isIntersecting){e.target.classList.add('in');io.unobserve(e.target);}});},{threshold:.12});
 document.querySelectorAll('.rv').forEach(function(el){io.observe(el);});
 document.querySelectorAll('.metrics .v[data-c]').forEach(function(el){var mo=new IntersectionObserver(function(es){es.forEach(function(e){if(e.isIntersecting){countUp(el);mo.unobserve(el);}});});mo.observe(el);});
diff --git a/public/portal.html b/public/portal.html
index 79b4628..0b643d5 100644
--- a/public/portal.html
+++ b/public/portal.html
@@ -16,8 +16,6 @@
 body{background:var(--bg);color:var(--ink);font-family:'Jost',system-ui,sans-serif;font-size:19px;line-height:1.75;-webkit-font-smoothing:antialiased}
 .disp{font-family:'Cormorant Garamond',Georgia,serif}a{color:inherit;text-decoration:none}
 .bar{position:fixed;top:0;left:0;right:0;z-index:40;display:flex;align-items:center;justify-content:flex-start;padding:18px 34px;background:linear-gradient(180deg,rgba(12,16,22,.94),rgba(12,16,22,0));backdrop-filter:blur(5px)}
-.brand{font-family:'Cormorant Garamond',serif;font-size:20px;letter-spacing:.28em;text-transform:uppercase}.brand span{color:var(--gold)}
-.brand small{display:block;font-family:'Jost';font-size:9px;letter-spacing:.32em;color:var(--gold);margin-top:2px}
 .burger{width:30px;height:20px;position:relative;cursor:pointer;background:none;border:0}.burger span{position:absolute;left:0;right:0;height:1.6px;background:var(--ink);transition:.35s}
 .burger span:nth-child(1){top:1px}.burger span:nth-child(2){top:9px}.burger span:nth-child(3){top:17px}
 body.nav .burger span:nth-child(1){transform:translateY(8px) rotate(45deg)}body.nav .burger span:nth-child(2){opacity:0}body.nav .burger span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
@@ -128,9 +126,9 @@ td.mo{font-family:'Cormorant Garamond',serif;color:var(--gold);font-size:18px;wi
 footer{padding:56px clamp(24px,7vw,120px);border-top:1px solid var(--line);color:var(--dim);font-size:12px;letter-spacing:.14em;text-transform:uppercase;display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px}
 @media(max-width:640px){.heybox{grid-template-columns:1fr}.metrics{gap:26px}}
 </style></head><body>
-<header class="bar"><button class="burger" onclick="document.body.classList.toggle('nav')" aria-label="Menu"><span></span><span></span><span></span></button></header>
+<header class="bar"><button class="burger" onclick="document.body.classList.toggle('nav')" aria-label="Menu" aria-expanded="false" aria-controls="portalmenu"><span></span><span></span><span></span></button></header>
 <div class="scrim" onclick="document.body.classList.remove('nav')"></div>
-<nav class="menu" onclick="if(event.target.tagName==='A')document.body.classList.remove('nav')">
+<nav class="menu" id="portalmenu" onclick="if(event.target.tagName==='A')document.body.classList.remove('nav')">
   <a class="mbrand" href="#summary">REN<span>TV</span>.com<small>Growth Strategy · 2026</small></a>
   <div class="mh">Contents</div><a href="#summary">Executive Summary</a><a href="#swot">SWOT Analysis</a><a href="#reputation">Reputation & Authority</a><a href="#empire">The Empire & Sublease.com</a><a href="#competitors">Competitors</a><a href="#advertising">Where to Advertise</a><a href="#timing">Timing & Cadence</a><a href="#audit">Website Audit</a><a href="#teardown">Page-by-Page Teardown</a><a href="#social">Social Media Audit</a><a href="#suggested">Suggested New Websites</a><a href="#partners">Unlikely Partners</a><a href="#revenue">Unlikely Revenue</a><a href="#videos">Video + Brand Films</a><a href="#dealdesk">Live Deal Desk (demo)</a><a href="#roadmap">90-Day Roadmap</a>
   <div class="minfo"><div class="mh">RENTV.com, Inc.</div><p>5757 W. Century Blvd., #700, Los Angeles, CA 90045</p><p>Steve Bloom — Owner / Producer · (310) 213-6409</p><p>Arnie Garfinkel — CRE Talk co-host · (818) 532-7660</p><p>Allen Wolfsheimer — News/Resources · (310) 836-8238</p><p>Daniel Ginzburg — CFO, Dandeana Corp · (424) 251-8405</p><p><a href="https://rentv.com" target="_blank" rel="noopener">rentv.com ↗</a> · <a href="https://www.rentvreview.com" target="_blank" rel="noopener">The REview ↗</a> · <a href="https://www.linkedin.com/company/rentv.com-inc" target="_blank" rel="noopener">LinkedIn ↗</a></p></div>
@@ -511,6 +509,8 @@ function drawRoad(sec){var rd=sec.querySelector('.road');if(rd)setTimeout(functi
 function setAll(o){accs.forEach(function(s){s.classList.toggle('open',o);var c=s.querySelector('.chev');if(c)c.textContent=o?'\u2013':'+';if(o)drawRoad(s);});if(o){initCharts();initDesk();}}
 document.getElementById('xall').onclick=function(){setAll(true);};document.getElementById('call').onclick=function(){setAll(false);};
 document.querySelectorAll('.menu a[href^="#"]').forEach(function(a){a.addEventListener('click',function(){var id=a.getAttribute('href').slice(1),s=document.getElementById(id);if(s&&!s.classList.contains('open')&&s.querySelector('.acchead')){s.querySelector('.acchead').click();}if(s)setTimeout(function(){s.scrollIntoView({behavior:'smooth'});},80);});});
+// Keep the burger's aria-expanded in sync with body.nav no matter which path (burger, scrim, or a menu link) toggles it.
+(function(){var burger=document.querySelector('.burger');if(!burger)return;function sync(){burger.setAttribute('aria-expanded',document.body.classList.contains('nav'));}new MutationObserver(sync).observe(document.body,{attributes:true,attributeFilter:['class']});sync();})();
 var io=new IntersectionObserver(function(es){es.forEach(function(e){if(e.isIntersecting){e.target.classList.add('in');io.unobserve(e.target);}});},{threshold:.12});
 document.querySelectorAll('.rv').forEach(function(el){io.observe(el);});
 document.querySelectorAll('.metrics .v[data-c]').forEach(function(el){var mo=new IntersectionObserver(function(es){es.forEach(function(e){if(e.isIntersecting){countUp(el);mo.unobserve(el);}});});mo.observe(el);});
← c9c45d8 rentv portal: strip top-banner elements into hamburger menu, · back to Consulting Rentv Com · chore: lint, refactor, v0.2.1 (session close) — mbrand neste da3ba3d →