`fix-caps.mjs`

60 lines
import { chromium } from 'playwright';
const OUT='/Users/macstudio3/Projects/rentv-master-reel/media/captures';
const BASE='https://rentv.agentabrams.com';
const CLEAN_CSS=`#cap-header{position:sticky;top:0;z-index:99999;display:flex;align-items:center;justify-content:space-between;height:64px;padding:0 24px;background:#fff;border-bottom:1px solid #e6eaef;font-family:-apple-system,sans-serif}#cap-header .cap-brand{font-size:23px;font-weight:800;color:#0d1b2a;text-decoration:none}#cap-header .cap-brand span{color:#c0392b}#cap-header button{background:none;border:0;color:#0d1b2a;display:inline-flex;padding:9px}`;

// Theme palette from theme.js
const THEMES={
  midnight:{ dark:true, accent:"#c9a84c", ink:"#f0f2f5", sub:"#8fa3b8", line:"#1e2d40", bg:"#0d1b2a", wash:"#132336", serif:"'DM Serif Display', Georgia, serif", sans:"'Archivo', system-ui, sans-serif" },
  salmon:{ dark:false, accent:"#00538b", ink:"#1a1a1a", sub:"#5c5c5c", line:"#d4c9b8", bg:"#fff1e5", wash:"#fde8d1", serif:"'Source Serif 4', Georgia, serif", sans:"'Inter', system-ui, sans-serif" }
};

async function normalize(page,darkBg){
  await page.addStyleTag({content:CLEAN_CSS + (darkBg?`\n#cap-header{background:${darkBg.bg}!important;border-bottom:1px solid ${darkBg.line}!important}#cap-header .cap-brand{color:${darkBg.ink}!important}#cap-header button{color:${darkBg.ink}!important}`:'')});
  await page.evaluate(()=>{const k=e=>e.closest('.drawer,#drawer,aside');document.querySelectorAll('header,nav,.util,.mast,.topnav').forEach(e=>{if(!k(e))e.style.display='none'});if(!document.getElementById('cap-header')){const bar=document.createElement('div');bar.id='cap-header';bar.innerHTML=`<button><svg width=24 height=24 viewBox="0 0 24 24" fill=none stroke=currentColor stroke-width=2.2 stroke-linecap=round><path d="M3 6h18M3 12h18M3 18h18"/></svg></button><a class=cap-brand href="/">REN<span>TV</span></a><button><svg width=21 height=21 viewBox="0 0 24 24" fill=none stroke=currentColor stroke-width=2><circle cx=12 cy=8 r=3.6/><path d="M4.5 20a7.5 7.5 0 0 1 15 0" stroke-linecap=round/></svg></button>`;document.body.insertBefore(bar,document.body.firstChild)}window.scrollTo(0,0)});
  await page.waitForTimeout(300);
}

const b=await chromium.launch();
const ctx=await b.newContext({viewport:{width:1440,height:810},deviceScaleFactor:2,httpCredentials:{username:'user',password:'RentvUser2026!'}});

// ---- article.png : real article page ----
{
  const p=await ctx.newPage();
  const resp=await p.goto(BASE+'/news/34251',{waitUntil:'domcontentloaded',timeout:45000});
  await p.waitForTimeout(1400);
  await normalize(p);
  await p.screenshot({path:`${OUT}/article.png`});
  console.log('OK article.png <- /news/34251 ['+resp.status()+']');
  await p.close();
}

// ---- theme captures ----
for (const [name,key] of [['theme-midnight','midnight'],['theme-salmon','salmon']]){
  const p=await ctx.newPage();
  const resp=await p.goto(BASE+'/',{waitUntil:'domcontentloaded',timeout:45000});
  await p.waitForTimeout(1400);
  const t=THEMES[key];
  await p.evaluate((t)=>{
    const r=document.documentElement;
    r.style.setProperty('--red',t.accent);r.style.setProperty('--ink',t.ink);
    r.style.setProperty('--sub',t.sub);r.style.setProperty('--line',t.line);
    r.style.setProperty('--bg',t.bg);r.style.setProperty('--wash',t.wash);
    r.style.setProperty('--serif',t.serif);r.style.setProperty('--sans',t.sans);
    document.body.classList.toggle('theme-dark',!!t.dark);
    // dark surface overrides (mirror theme.js)
    if(t.dark){
      const st=document.createElement('style');st.id='dark-ovr';
      st.textContent="body.theme-dark .util,body.theme-dark footer,body.theme-dark .ns,body.theme-dark .mast{background:var(--wash)!important}body.theme-dark .util,body.theme-dark .util a,body.theme-dark footer,body.theme-dark footer a,body.theme-dark footer p{color:var(--sub)!important}body.theme-dark footer .logo,body.theme-dark footer h5{color:var(--ink)!important}body.theme-dark .ns{color:var(--ink)!important}body.theme-dark .ns p{color:var(--sub)!important}";
      document.head.appendChild(st);
    }
    document.body.style.background=t.bg;
  },t);
  await p.waitForTimeout(700);
  await normalize(p, t.dark?t:null);
  await p.screenshot({path:`${OUT}/${name}.png`});
  console.log('OK '+name+'.png theme='+key+' ['+resp.status()+']');
  await p.close();
}
await b.close();