← back to Rentv V1
public/article.html
138 lines
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
<title>RENTV.com — Story</title>
<meta name="description" content="Commercial real estate news story — RENTV.com.">
<link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400&family=Inter:wght@300;400;600;800&display=swap" rel="stylesheet">
<style>
:root{--red:#c8102e;--ink:#14171a;--sub:#5b636b;--line:#e4e7ea;--bg:#fff;--wash:#f5f6f8;--sans:'Inter',system-ui,sans-serif;--serif:'Playfair Display',Georgia,serif}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--sans);color:var(--ink);background:var(--bg);line-height:1.6}
a{color:inherit;text-decoration:none}
.wrap{max-width:1200px;margin:0 auto;padding:0 20px}
.util{background:var(--ink);color:#cfd4d9;font-size:12px}
.util .wrap{display:flex;justify-content:space-between;align-items:center;height:34px}
.util .acts a{margin-left:14px;color:#cfd4d9}.util .acts a.sub{color:#fff;background:var(--red);padding:4px 12px;border-radius:3px;font-weight:700}
.mast{border-bottom:2px solid var(--ink);padding:18px 0 12px}
.mast .wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:3px}
.logo{font-family:var(--serif);font-weight:700;font-size:42px;letter-spacing:-1px}.logo span{color:var(--red)}
.logo small{display:block;font-size:11px;font-weight:600;letter-spacing:3px;color:var(--sub);text-transform:uppercase;margin-top:2px;font-family:var(--sans)}
.datebox{font-size:12px;color:var(--sub);text-align:center}
nav{border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;z-index:10}
nav .wrap{display:flex;gap:2px;align-items:center;height:46px}
.ham{display:none;background:none;border:0;font-size:24px;line-height:1;color:var(--ink);cursor:pointer;padding:8px 12px 8px 0;margin-right:4px}
.navlinks{display:flex;gap:2px;align-items:center;overflow-x:auto}
nav a{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:13px 8px;border-bottom:3px solid transparent;white-space:nowrap}
nav a:hover,nav a.on{color:var(--red);border-color:var(--red)}
@media(max-width:860px){
.ham{display:block;margin-left:auto}
nav .wrap{height:52px}
.navlinks{display:none;position:absolute;top:52px;left:0;right:0;background:#fff;flex-direction:column;align-items:stretch;border-bottom:2px solid var(--ink);box-shadow:0 10px 24px rgba(0,0,0,.14);z-index:30;max-height:78vh;overflow-y:auto}
.navlinks.open{display:flex}
.navlinks a{padding:15px 20px;border-bottom:1px solid var(--line);border-left:4px solid transparent}
.navlinks a:hover{color:var(--red);border-left-color:var(--red)}
}
.art{max-width:760px;margin:0 auto;padding:26px 0 10px}
.crumb{font-size:12px;color:var(--sub);margin-bottom:16px}.crumb a{color:var(--red);font-weight:700}
.chip{display:inline-block;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--red);margin-bottom:8px}
h1{font-family:var(--serif);font-size:40px;line-height:1.12;letter-spacing:-.5px;margin-bottom:10px}
.byl{font-size:13px;color:var(--sub);border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:20px}
.hero{aspect-ratio:16/8;border-radius:8px;background:linear-gradient(135deg,#1f2937,#c8102e);margin:0 0 22px;overflow:hidden}
.hero img{width:100%;height:100%;object-fit:cover;display:block}
.body p{font-size:18px;margin-bottom:18px}
.body p:first-of-type::first-letter{font-family:var(--serif);font-size:56px;font-weight:700;float:left;line-height:.8;padding:6px 10px 0 0;color:var(--red)}
.src{margin:26px 0;padding:18px;background:var(--wash);border-radius:8px;font-size:14px}
.src a{color:var(--red);font-weight:800}
.back{display:inline-block;margin:10px 0 0;font-size:13px;font-weight:700;color:var(--red)}
.skl{background:linear-gradient(90deg,#eee,#f6f6f6,#eee);background-size:200% 100%;animation:sh 1.2s infinite;border-radius:4px;color:transparent}
@keyframes sh{to{background-position:-200% 0}}
.err{color:var(--sub);padding:20px 0}.err a{color:var(--red);font-weight:700}
footer{background:var(--ink);color:#aeb6bd;margin-top:36px;padding:40px 0 30px;font-size:13px}
footer .cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:28px}
footer .logo{color:#fff;font-size:26px;margin-bottom:8px}footer h5{color:#fff;font-size:12px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px}footer a{display:block;padding:4px 0;color:#aeb6bd}
footer .fine{border-top:1px solid #2a2f34;margin-top:26px;padding-top:16px;font-size:12px;color:#7c848b}
@media(max-width:860px){h1{font-size:30px}.body p{font-size:17px}}
</style>
</head>
<body>
<div class="util"><div class="wrap">
<div><a href="/">RENTV.com</a> · Commercial Real Estate News</div>
<div class="acts"><a href="/subscribe">Newsletters</a><a href="/advertise">Advertise</a><a class="sub" href="/subscribe">Subscribe</a></div>
</div></div>
<header class="mast"><div class="wrap">
<a href="/" class="logo">REN<span>TV</span>.com<small>Commercial Real Estate News</small></a>
<div class="datebox"><span>Western U.S. Edition</span><br><span id="today"></span></div>
</div></header>
<nav><div class="wrap">
<button class="ham" id="hamBtn" aria-label="Menu" aria-expanded="false">☰</button>
<div class="navlinks" id="nav"><a href="/">Home</a><a href="/sales">Sales</a><a href="/leases">Leases</a><a href="/financing">Financing</a><a href="/development">Development</a><a href="/multifamily">Multifamily</a><a href="/industrial">Industrial</a><a href="/retail">Retail</a><a href="/markets">Markets</a><a href="/review">The REview</a><a href="/cre-talk">CRE Talk</a><a href="/conferences">Conferences</a><a href="/versions">Versions</a><a href="/blog">Blog</a></div>
</div></nav>
<div class="wrap"><article class="art" id="art">
<div class="crumb"><a href="/">Home</a> › <span>Story</span></div>
<span class="chip">RENTV · Western U.S.</span>
<h1 class="skl">Loading the story…<br> </h1>
<div class="byl">Fetching live from rentv.com…</div>
<div class="hero skl"></div>
<div class="body"><p class="skl"> <br> <br> </p></div>
</article></div>
<footer><div class="wrap"><div class="cols">
<div><div class="logo">REN<span style="color:var(--red)">TV</span>.com</div><p style="max-width:34ch">Commercial real estate news, deals & conferences across the Western United States since 1998.</p></div>
<div><h5>Sections</h5><a href="/sales">Sales</a><a href="/leases">Leases</a><a href="/financing">Financing</a><a href="/development">Development</a><a href="/multifamily">Multifamily</a><a href="/industrial">Industrial</a><a href="/retail">Retail</a><a href="/markets">Markets</a></div>
<div><h5>Company</h5><a href="/about">About</a><a href="/advertise">Advertise</a><a href="/conferences">Conferences</a><a href="/subscribe">Subscribe</a></div>
<div><h5>Follow</h5><a href="https://www.linkedin.com/company/rentv.com-inc" target="_blank" rel="noopener">LinkedIn</a><a href="/review">The REview</a><a href="/cre-talk">CRE Talk</a><a href="/subscribe">Newsletters</a></div>
</div><div class="fine">© 2026 RENTV.com · Commercial real estate news, Western U.S. · Headlines refreshed live from rentv.com</div></div></footer>
<script>
document.getElementById('today').textContent = new Date().toLocaleDateString(undefined,{weekday:'long',year:'numeric',month:'long',day:'numeric'});
const esc=s=>(s||'').replace(/[&<>"]/g,c=>({'&':'&','<':'<','>':'>','"':'"'}[c]));
// Accept both link forms: /news/:id (homepage) AND /article.html?id= (search results + RSS/JSON feeds).
const id=((new URLSearchParams(location.search).get('id'))||location.pathname.split('/').filter(Boolean).pop()||'').replace(/[^0-9]/g,'');
// Generic titles the reader proxy returns when rentv.com doesn't server-render the story.
const GENERIC=/^RENTV\.com\b|commercial real estate news and property/i;
async function load(){
const art=document.getElementById('art');
if(!id){art.innerHTML='<p class="err">Story not found. <a href="/">Back to the homepage →</a></p>';return;}
// Fetch the live feed (guaranteed correct headline/category) and the reader proxy (best-effort body) together.
const [feed, art0] = await Promise.allSettled([
fetch('/api/news').then(r=>r.json()),
fetch('/api/article/'+id).then(r=>r.ok?r.json():null)
]);
const item = (feed.status==='fulfilled' ? (feed.value.items||[]).find(x=>String(x.id)===id) : null) || {};
const d = (art0.status==='fulfilled' && art0.value) ? art0.value : {};
// Prefer the feed's real headline; fall back to the proxy title only if it isn't the generic site title.
const title = item.title || (d.title && !GENERIC.test(d.title) ? d.title : 'RENTV Story');
const cat = item.cat || 'RENTV';
const hasBody = Array.isArray(d.body) && d.body.length>0;
if(!item.title && !hasBody && art0.status!=='fulfilled'){
art.innerHTML='<p class="err">This story couldn’t be loaded right now.<br><br><a href="/">← Back to the homepage</a></p>';
return;
}
document.title=title+' — RENTV.com';
const hero=(d.image && !GENERIC.test(d.image))?'<div class="hero"><img src="'+esc(d.image)+'" alt="" loading="lazy" onerror="this.parentNode.style.background=\'linear-gradient(135deg,#1f2937,#c8102e)\';this.remove()"></div>':'<div class="hero"></div>';
const body=hasBody
? d.body.map(p=>'<p>'+esc(p)+'</p>').join('')
: '<p>The full report — including deal terms, parties and broker details — is being republished here. Check back shortly for the complete story.</p>';
art.innerHTML=
'<div class="crumb"><a href="/">Home</a> › '+(['sales','leases','financing','development','multifamily','industrial','retail'].indexOf(cat.toLowerCase())>=0?'<a href="/'+esc(cat.toLowerCase())+'">'+esc(cat)+'</a>':'<span>'+esc(cat)+'</span>')+' › <span>Story</span></div>'+
'<span class="chip">'+esc(cat)+' · Western U.S.</span>'+
'<h1>'+esc(title)+'</h1>'+
'<div class="byl">By RENTV Staff · live from rentv.com'+(d.fetched_at?(' · fetched '+new Date(d.fetched_at).toLocaleTimeString()):'')+'</div>'+
hero+
'<div class="body">'+body+'</div>'+
'<div class="src">📰 Republished live from RENTV.com · Western U.S. commercial real estate news.</div>'+
'<a class="back" href="/">← Back to all CRE news</a>';
}
const hamBtn=document.getElementById('hamBtn');
hamBtn.addEventListener('click',()=>{const open=document.getElementById('nav').classList.toggle('open');hamBtn.setAttribute('aria-expanded',open);});
load();
</script>
<script src="/theme.js"></script>
</body>
</html>