← back to Rentv Bloom Flyers
Tabbed viewer + Photoshop key-art; deploy bundle for rentv.agentabrams.com/826
9fc27499adc7f93f5184d79b4292e507234edec5 · 2026-08-07 15:52:51 -0700 · Steve Abrams
Files touched
A concepts/ps-keyart-steve-bloom.pngA public/concepts/ps-keyart-steve-bloom.pngM public/index.htmlA public/thumbs/ps-keyart-steve-bloom.png
Diff
commit 9fc27499adc7f93f5184d79b4292e507234edec5
Author: Steve Abrams <steve@designerwallcoverings.com>
Date: Fri Aug 7 15:52:51 2026 -0700
Tabbed viewer + Photoshop key-art; deploy bundle for rentv.agentabrams.com/826
---
concepts/ps-keyart-steve-bloom.png | Bin 0 -> 37447 bytes
public/concepts/ps-keyart-steve-bloom.png | Bin 0 -> 37447 bytes
public/index.html | 195 ++++++++++++++++++------------
public/thumbs/ps-keyart-steve-bloom.png | Bin 0 -> 37447 bytes
4 files changed, 115 insertions(+), 80 deletions(-)
diff --git a/concepts/ps-keyart-steve-bloom.png b/concepts/ps-keyart-steve-bloom.png
new file mode 100644
index 0000000..7afa6d2
Binary files /dev/null and b/concepts/ps-keyart-steve-bloom.png differ
diff --git a/public/concepts/ps-keyart-steve-bloom.png b/public/concepts/ps-keyart-steve-bloom.png
new file mode 100644
index 0000000..7afa6d2
Binary files /dev/null and b/public/concepts/ps-keyart-steve-bloom.png differ
diff --git a/public/index.html b/public/index.html
index 0f8f5d1..b944a20 100644
--- a/public/index.html
+++ b/public/index.html
@@ -3,99 +3,134 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
-<title>RENTV × Steve Bloom — 6 Flyer Concepts</title>
-<link rel="preconnect" href="https://fonts.googleapis.com">
-<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Playfair+Display:wght@600;700&display=swap" rel="stylesheet">
+<title>RENTV × Steve Bloom — Flyer Concepts</title>
+<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Playfair+Display:wght@700&display=swap" rel="stylesheet">
+<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
<style>
- :root{--blue:#16357A;--navy:#0E2350;--gold:#E8A81C;--red:#D0202E;--ink:#141414;--gray:#6B7280;--panel:#F4F6FB}
+ :root{--blue:#16357A;--navy:#0E2350;--gold:#E8A81C;--red:#D0202E}
*{box-sizing:border-box}
- body{margin:0;font-family:Inter,system-ui,sans-serif;background:#0b1730;color:#eaf0ff}
- a{color:inherit;text-decoration:none}
- header{padding:28px 32px 20px;border-bottom:1px solid #24345f;background:linear-gradient(180deg,#0e2350,#0b1730)}
- .brand{display:flex;align-items:center;gap:14px}
- .logo{width:120px;height:44px}
- h1{font-family:'Playfair Display',serif;font-size:26px;margin:14px 0 4px;font-weight:700}
- .sub{color:#9fb0d8;font-size:14px;max-width:760px;line-height:1.5}
- nav{margin-top:16px;display:flex;gap:10px;flex-wrap:wrap}
- nav a{padding:8px 16px;border:1px solid #2c3e6e;border-radius:999px;font-size:13px;font-weight:600;background:#132347}
- nav a.active{background:var(--gold);color:#1a1200;border-color:var(--gold)}
- .wrap{padding:28px 32px 60px}
- .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px}
- .card{background:#101f42;border:1px solid #24345f;border-radius:14px;overflow:hidden;transition:transform .15s,border-color .15s}
- .card:hover{transform:translateY(-4px);border-color:var(--gold)}
- .thumbwrap{background:#fff;position:relative;aspect-ratio:816/1056;overflow:hidden;border-bottom:1px solid #24345f}
- .thumbwrap img{width:100%;display:block}
- .tag{position:absolute;top:10px;left:10px;background:rgba(14,35,80,.92);color:#fff;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:5px 10px;border-radius:6px}
- .tag.brand{background:var(--red)}.tag.kit{background:var(--blue)}.tag.ad{background:#0a7c3e}
- .meta{padding:14px 16px 18px}
- .meta h3{margin:0 0 4px;font-size:16px;font-weight:700}
- .meta p{margin:0 0 12px;font-size:13px;color:#9fb0d8;line-height:1.45;min-height:38px}
- .actions{display:flex;gap:8px}
- .btn{flex:1;text-align:center;padding:9px;border-radius:8px;font-size:13px;font-weight:600;border:1px solid #2c3e6e;background:#132347}
- .btn.primary{background:var(--gold);color:#1a1200;border-color:var(--gold)}
- footer{padding:24px 32px;color:#7d8db5;font-size:12px;border-top:1px solid #24345f}
- .note{margin:22px 0 6px;padding:14px 16px;background:#132347;border:1px solid #2c3e6e;border-left:3px solid var(--gold);border-radius:8px;font-size:13px;color:#cdd8f5;line-height:1.5}
+ html,body{margin:0;height:100%}
+ body{font-family:Inter,system-ui,sans-serif;background:#0b1730;color:#eaf0ff;display:flex;flex-direction:column;min-height:100vh}
+ a{color:inherit}
+ header{padding:16px 24px 0;background:linear-gradient(180deg,#0e2350,#0b1730);border-bottom:1px solid #24345f}
+ .top{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
+ .logo{width:104px;height:38px;flex:none}
+ .htxt h1{font-family:'Playfair Display',serif;font-size:19px;margin:0}
+ .htxt p{margin:2px 0 0;font-size:12.5px;color:#9fb0d8}
+ .tabs{display:flex;gap:6px;flex-wrap:wrap;margin-top:14px}
+ .tab{padding:9px 14px;border:1px solid #2c3e6e;border-bottom:none;border-radius:8px 8px 0 0;font-size:12.5px;font-weight:600;background:#101f42;cursor:pointer;white-space:nowrap;color:#cdd8f5}
+ .tab:hover{background:#16264d}
+ .tab.active{background:var(--gold);color:#1a1200;border-color:var(--gold)}
+ .tab .k{opacity:.6;font-weight:700;margin-right:5px}
+ main{flex:1;position:relative;background:#0b1730}
+ .view{display:none;position:absolute;inset:0}
+ .view.active{display:block}
+ .flyerbar{position:absolute;top:0;left:0;right:0;height:44px;background:#0f1d3d;border-bottom:1px solid #24345f;display:flex;align-items:center;gap:10px;padding:0 16px;z-index:2;font-size:13px}
+ .flyerbar b{font-weight:700}
+ .flyerbar .sp{flex:1}
+ .flyerbar a{padding:6px 12px;border:1px solid #2c3e6e;border-radius:7px;font-size:12px;font-weight:600;background:#132347;text-decoration:none;color:#eaf0ff}
+ .flyerbar a.gold{background:var(--gold);color:#1a1200;border-color:var(--gold)}
+ iframe{position:absolute;top:44px;left:0;width:100%;height:calc(100% - 44px);border:0;background:#525663}
+ .imgwrap{position:absolute;inset:44px 0 0;overflow:auto;text-align:center;background:#3a3f4c;padding:20px}
+ .imgwrap2{position:absolute;inset:0;overflow:auto;background:#3a3f4c;padding:24px;display:flex;gap:24px;flex-wrap:wrap;justify-content:center}
+ .imgwrap2 figure{margin:0;max-width:460px}
+ .imgwrap2 img,.imgwrap figure img{max-width:100%;box-shadow:0 8px 40px rgba(0,0,0,.5);border-radius:4px}
+ .imgwrap2 figcaption{color:#dfe6f7;font-size:12.5px;margin-top:8px}
+ /* sponsors */
+ .spwrap{position:absolute;inset:0;overflow:auto;padding:18px 24px 60px}
+ .callout{padding:14px 16px;background:#0a7c3e22;border:1px solid #0a7c3e;border-left:4px solid #23c274;border-radius:10px;font-size:13px;line-height:1.55;margin-bottom:16px}
+ .subtabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
+ .subtab{padding:8px 14px;border:1px solid #2c3e6e;border-radius:8px;font-size:12.5px;font-weight:600;background:#101f42;cursor:pointer}
+ .subtab.active{background:var(--blue);color:#fff;border-color:var(--blue)}
+ .md{background:#0f1d3d;border:1px solid #24345f;border-radius:12px;padding:22px 26px;line-height:1.6;font-size:13.5px;max-width:1150px}
+ .md h1{font-family:'Playfair Display',serif;font-size:23px;color:#fff;border-bottom:1px solid #2c3e6e;padding-bottom:8px}
+ .md h2{color:var(--gold);font-size:17px;margin-top:24px}
+ .md table{border-collapse:collapse;width:100%;margin:12px 0;font-size:12px}
+ .md th,.md td{border:1px solid #2c3e6e;padding:6px 8px;text-align:left;vertical-align:top}
+ .md th{background:#16357A;color:#fff}
+ .md tr:nth-child(even) td{background:#122142}
+ .md a{color:#ffd980;word-break:break-word}
+ .loading{color:#9fb0d8;padding:16px}
</style>
</head>
<body>
<header>
- <div class="brand">
+ <div class="top">
<svg class="logo" viewBox="0 0 240 88" xmlns="http://www.w3.org/2000/svg" aria-label="RENTV">
<ellipse cx="120" cy="40" rx="112" ry="34" fill="none" stroke="#E8A81C" stroke-width="6"/>
<text x="120" y="52" text-anchor="middle" font-family="Inter,sans-serif" font-weight="800" font-size="40" fill="#fff" letter-spacing="2">RENTV</text>
<text x="120" y="80" text-anchor="middle" font-family="Inter,sans-serif" font-weight="600" font-size="12" fill="#9fb0d8" letter-spacing="3">REAL ESTATE NEWS & MEDIA</text>
</svg>
+ <div class="htxt"><h1>Steve Bloom / RENTV — 6 Flyer Concepts + Key Art</h1>
+ <p>Pick a version with the tabs. Every concept carries the full contact block · (310) 213-6409 · sbloom@rentv.com · rentv.com</p></div>
</div>
- <h1>Steve Bloom / RENTV — 6 Flyer Concepts</h1>
- <div class="sub">Six premium redesigns of RENTV's corporate media kit, spread across three directions — modern media-kit, focused ad-sales one-pager, and Steve Bloom personal brand. Every concept carries the full contact block (phone, email, LinkedIn, sites, address). Click <b>Open flyer</b> for the live print-ready page.</div>
- <nav>
- <a class="active" href="index.html">◱ Flyer Concepts</a>
- <a href="sponsors.html">◉ CRE Ad-Buyer Prospects</a>
- <a href="source.html">⌸ Original Flyer</a>
- </nav>
+ <div class="tabs" id="tabs"></div>
</header>
-<div class="wrap">
- <div class="grid">
+<main id="main"></main>
- <div class="card">
- <a href="concepts/concept-1-editorial-media-kit.html"><div class="thumbwrap"><span class="tag kit">Media Kit</span><img src="thumbs/concept-1-editorial-media-kit.png" alt="Concept 1"></div></a>
- <div class="meta"><h3>1 · Editorial Media Kit</h3><p>Clean magazine layout, Playfair serif headlines, a 4-stat band and a tidy product/pricing grid.</p>
- <div class="actions"><a class="btn primary" href="concepts/concept-1-editorial-media-kit.html">Open flyer</a><a class="btn" href="thumbs/concept-1-editorial-media-kit.png">PNG</a></div></div>
- </div>
-
- <div class="card">
- <a href="concepts/concept-2-data-terminal.html"><div class="thumbwrap"><span class="tag kit">Media Kit</span><img src="thumbs/concept-2-data-terminal.png" alt="Concept 2"></div></a>
- <div class="meta"><h3>2 · Data Terminal (Dark)</h3><p>Deep-navy Bloomberg-terminal aesthetic, mono numerics, pricing as a right-aligned data table.</p>
- <div class="actions"><a class="btn primary" href="concepts/concept-2-data-terminal.html">Open flyer</a><a class="btn" href="thumbs/concept-2-data-terminal.png">PNG</a></div></div>
- </div>
-
- <div class="card">
- <a href="concepts/concept-3-adsales-pricing.html"><div class="thumbwrap"><span class="tag ad">Ad-Sales</span><img src="thumbs/concept-3-adsales-pricing.png" alt="Concept 3"></div></a>
- <div class="meta"><h3>3 · Ad-Sales Pricing Tiers</h3><p>Conversion one-pager: benefit hero, three pricing-tier cards, Steve's phone in the CTA.</p>
- <div class="actions"><a class="btn primary" href="concepts/concept-3-adsales-pricing.html">Open flyer</a><a class="btn" href="thumbs/concept-3-adsales-pricing.png">PNG</a></div></div>
- </div>
-
- <div class="card">
- <a href="concepts/concept-4-reach-infographic.html"><div class="thumbwrap"><span class="tag ad">Ad-Sales</span><img src="thumbs/concept-4-reach-infographic.png" alt="Concept 4"></div></a>
- <div class="meta"><h3>4 · Reach Infographic</h3><p>Oversized stats, a Western-US coverage map, and an iconographic "what you can buy" strip.</p>
- <div class="actions"><a class="btn primary" href="concepts/concept-4-reach-infographic.html">Open flyer</a><a class="btn" href="thumbs/concept-4-reach-infographic.png">PNG</a></div></div>
- </div>
-
- <div class="card">
- <a href="concepts/concept-5-podcast-host.html"><div class="thumbwrap"><span class="tag brand">Bloom Brand</span><img src="thumbs/concept-5-podcast-host.png" alt="Concept 5"></div></a>
- <div class="meta"><h3>5 · CRE Talk — Podcast Host</h3><p>Podcast-cover promo: Steve Bloom + Arnie Garfinkel, mic/soundwave motif, 4 sponsor slots.</p>
- <div class="actions"><a class="btn primary" href="concepts/concept-5-podcast-host.html">Open flyer</a><a class="btn" href="thumbs/concept-5-podcast-host.png">PNG</a></div></div>
- </div>
-
- <div class="card">
- <a href="concepts/concept-6-ceo-profile.html"><div class="thumbwrap"><span class="tag brand">Bloom Brand</span><img src="thumbs/concept-6-ceo-profile.png" alt="Concept 6"></div></a>
- <div class="meta"><h3>6 · CEO / Thought Leader</h3><p>Elegant executive profile — 25-year authority, portrait, pull-quote, credentials.</p>
- <div class="actions"><a class="btn primary" href="concepts/concept-6-ceo-profile.html">Open flyer</a><a class="btn" href="thumbs/concept-6-ceo-profile.png">PNG</a></div></div>
- </div>
-
- </div>
- <div class="note"><b>Contact block on every concept:</b> Steve Bloom, President & CEO · (310) 213-6409 · sbloom@rentv.com · linkedin.com/company/rentv.com-inc · rentv.com · rentvreview.com · sublease.com · 5757 W. Century Blvd #700, Los Angeles CA 90045 · Allen Wolfsheimer, SVP · (310) 836-9238 · allenw@rentv.com. <i>(LinkedIn shown is the company page — confirm Steve's personal profile URL and I'll swap it in.)</i></div>
-</div>
-<footer>Built for Steve · concepts are print-ready 8.5×11 HTML · Figma + Photoshop variants generated alongside · nothing has been sent or published.</footer>
+<script>
+const FLYERS = [
+ {k:'1', label:'Editorial Kit', file:'concepts/concept-1-editorial-media-kit.html', dir:'Media Kit', png:'thumbs/concept-1-editorial-media-kit.png'},
+ {k:'2', label:'Data Terminal', file:'concepts/concept-2-data-terminal.html', dir:'Media Kit (dark)', png:'thumbs/concept-2-data-terminal.png'},
+ {k:'3', label:'Ad-Sales Tiers', file:'concepts/concept-3-adsales-pricing.html', dir:'Ad-Sales 1-pager', png:'thumbs/concept-3-adsales-pricing.png'},
+ {k:'4', label:'Reach Infographic',file:'concepts/concept-4-reach-infographic.html', dir:'Ad-Sales 1-pager', png:'thumbs/concept-4-reach-infographic.png'},
+ {k:'5', label:'Podcast Host', file:'concepts/concept-5-podcast-host.html', dir:'Bloom personal brand', png:'thumbs/concept-5-podcast-host.png'},
+ {k:'6', label:'CEO Profile', file:'concepts/concept-6-ceo-profile.html', dir:'Bloom personal brand', png:'thumbs/concept-6-ceo-profile.png'},
+];
+const SPONSORS = [
+ {f:'research/sponsors-la-socal.md', label:'LA / SoCal · 30'},
+ {f:'research/sponsors-western-footprint.md',label:'Western Footprint · 33'},
+ {f:'research/sponsors-central-coast.md', label:'Central Coast · 20'},
+ {f:'research/sponsors-national.md', label:'National · 28'},
+];
+const tabsEl=document.getElementById('tabs'), mainEl=document.getElementById('main');
+const views={};
+function addTab(id,html,build){
+ const t=document.createElement('div'); t.className='tab'; t.innerHTML=html; t.dataset.id=id;
+ t.onclick=()=>select(id); tabsEl.appendChild(t);
+ const v=document.createElement('div'); v.className='view'; v.id='view-'+id; mainEl.appendChild(v);
+ views[id]={tab:t,view:v,build,built:false};
+}
+function select(id){
+ Object.values(views).forEach(o=>{o.tab.classList.remove('active');o.view.classList.remove('active')});
+ const o=views[id]; o.tab.classList.add('active'); o.view.classList.add('active');
+ if(!o.built){o.build(o.view);o.built=true;}
+}
+// flyer tabs
+FLYERS.forEach(fl=>addTab('f'+fl.k, '<span class="k">'+fl.k+'</span>'+fl.label, v=>{
+ v.innerHTML='<div class="flyerbar"><b>'+fl.label+'</b> — '+fl.dir+
+ '<span class="sp"></span>'+
+ '<a class="gold" href="'+fl.file+'" target="_blank">Open full ↗</a>'+
+ '<a href="'+fl.png+'" target="_blank">PNG</a>'+
+ '<a href="'+fl.file+'" target="_blank" onclick="return true">Print</a></div>'+
+ '<iframe src="'+fl.file+'" title="'+fl.label+'"></iframe>';
+}));
+// key art tab
+addTab('keyart','<span class="k">★</span>Key Art (PS)', v=>{
+ v.innerHTML='<div class="flyerbar"><b>Photoshop Key Art</b> — Steve Bloom / Commercial Real Estate Talk'+
+ '<span class="sp"></span><a class="gold" href="concepts/ps-keyart-steve-bloom.png" target="_blank">Open PNG ↗</a></div>'+
+ '<div class="imgwrap"><figure><img src="concepts/ps-keyart-steve-bloom.png" alt="Steve Bloom key art"></figure></div>';
+});
+// sponsors tab
+addTab('sponsors','◉ CRE Ad-Buyers', v=>{
+ v.innerHTML='<div class="spwrap">'+
+ '<div class="callout">🔥 <b>Warmest — already paying:</b> RENTV.com's own homepage currently runs live ads from <b>CBRE</b>, <b>Rockefeller Group</b>, <b>Premier Workspaces</b> and <b>Chase Partners</b> — renew/upsell first. Next: commercial <b>title/escrow</b> (First American, Fidelity, Chicago Title) and repeat brokerage spenders (<b>Marcus & Millichap</b>, <b>Kidder Mathews</b>).</div>'+
+ '<div class="subtabs" id="sptabs"></div><div class="md" id="spmd"><div class="loading">Loading…</div></div></div>';
+ const st=v.querySelector('#sptabs'), md=v.querySelector('#spmd');
+ async function load(f){ md.innerHTML='<div class="loading">Loading…</div>';
+ try{const r=await fetch(f);const t=await r.text();md.innerHTML=marked.parse(t);
+ md.querySelectorAll('a').forEach(a=>a.target='_blank');}catch(e){md.innerHTML='<div class="loading">Error: '+e+'</div>';}}
+ SPONSORS.forEach((s,i)=>{const b=document.createElement('div');b.className='subtab'+(i===0?' active':'');b.textContent=s.label;
+ b.onclick=()=>{st.querySelectorAll('.subtab').forEach(x=>x.classList.remove('active'));b.classList.add('active');load(s.f);};st.appendChild(b);});
+ load(SPONSORS[0].f);
+});
+// original tab
+addTab('source','⌸ Original', v=>{
+ v.innerHTML='<div class="imgwrap2">'+
+ '<figure><img src="source/corp-flyer-apr2026-v3.jpg" alt="corp flyer"><figcaption>Corp Flyer Apr 2026 V3 — the current corporate services menu (primary redesign target)</figcaption></figure>'+
+ '<figure><img src="source/property-spotlight-flyer-apr2025.jpg" alt="spotlight flyer"><figcaption>Property Spotlight Flyer Rev Apr 2025 — the eblast sell-sheet</figcaption></figure></div>';
+});
+select('f1');
+</script>
</body>
</html>
diff --git a/public/thumbs/ps-keyart-steve-bloom.png b/public/thumbs/ps-keyart-steve-bloom.png
new file mode 100644
index 0000000..7afa6d2
Binary files /dev/null and b/public/thumbs/ps-keyart-steve-bloom.png differ
← 33b76f4 RENTV/Steve Bloom: 6 flyer concepts + CRE ad-buyer research
·
back to Rentv Bloom Flyers
·
Add per-flyer + all-6 PDF downloads to the tabbed selector; 6b75ccd →