martbost
a57af32f4a
Once every member from Ascensus up could hold several pages, the Funnel Factory's differentiator became a count — the same quantity-not-kind flaw the upper tiers had. L6 now unlocks identity instead: a member's own name, monogram and accent colour on every page they build. Below Fastigium you have a page on the team site; at Fastigium it becomes yours. Three deliberate limits. NO IMAGE UPLOADS. A logo file uploaded by a member and served from rmcircle.team is an abuse surface — whatever they upload lives on our domain. The mark is a monogram generated from their brand name instead: real identity, nothing to moderate. Same reasoning that keeps Traffic Desk creative team-only. ACCENTS ARE A CURATED SET, not a colour picker. Every option is checked against the dark ground, so nobody can pick something that makes their own page unreadable and then wonder why it converts badly. THE DISCLAIMERS ARE NOT THEIRS TO BRAND. Branding replaces the header identity only; the footer — independent team resource, no income guaranteed, cryptocurrency risk — is rendered by us and cannot be removed or restyled. Co-branding, not white-labelling. Verified in the renderer. Branding is resolved against the LIVE contract level at render time, so a position that drops below Fastigium reverts to team identity on its own rather than keeping something it no longer holds. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
78 lines
5.7 KiB
HTML
78 lines
5.7 KiB
HTML
<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="robots" content="noindex"><meta name="description" content="Co-Branded Pages — put your own name, monogram and colour on every page you build."><title>Co-Branded Pages | The Circle Suite</title><link rel="icon" type="image/png" href="/favicon.png"><link rel="stylesheet" href="/styles.css">
|
|
<style>
|
|
.bw{max-width:800px;margin:0 auto;padding:24px 20px 70px}
|
|
.bw h1{font-size:clamp(26px,4.5vw,36px);margin:6px 0 8px}
|
|
.bw .lede{color:var(--muted);line-height:1.6;margin-bottom:18px}
|
|
#bGate{display:none;border:2px solid var(--gold);border-radius:12px;padding:16px 20px;margin-bottom:18px;line-height:1.6}
|
|
.b-card{background:var(--card,#0d2236);border:1px solid var(--line,#24425d);border-radius:14px;padding:18px 20px;margin-bottom:16px}
|
|
label.b-lab{display:block;font-weight:700;font-size:14px;margin:16px 0 5px}
|
|
label.b-lab:first-of-type{margin-top:0}
|
|
.b-hint{color:var(--muted);font-size:12.5px;line-height:1.5;margin-bottom:7px}
|
|
.b-card input[type=text]{width:100%;background:var(--bg,#0b1d2e);border:1px solid var(--line);border-radius:10px;
|
|
color:var(--text);padding:11px 13px;font:inherit;font-size:15px}
|
|
.b-swatches{display:flex;flex-wrap:wrap;gap:9px}
|
|
.b-sw{width:44px;height:44px;border-radius:50%;border:3px solid transparent;cursor:pointer;padding:0;
|
|
box-shadow:0 0 0 1px var(--line) inset}
|
|
.b-sw.on{border-color:var(--text)}
|
|
.b-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:18px}
|
|
#bErr{display:none;color:#f0a05a;margin-top:12px;font-size:14px;line-height:1.55}
|
|
#bOk{display:none;border:2px solid var(--teal);border-radius:12px;padding:14px 18px;margin-top:14px;line-height:1.6}
|
|
.b-prev{border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-top:6px}
|
|
.b-prevbar{display:flex;align-items:center;gap:11px;padding:14px 18px;background:#071421}
|
|
.b-mono{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;
|
|
font-weight:900;font-size:16px;letter-spacing:.5px}
|
|
.b-prevbar .nm{font-weight:800;font-size:16px;line-height:1.2}
|
|
.b-prevbar .tg{font-size:12px;color:var(--muted)}
|
|
.b-prevbody{padding:16px 18px;background:#071421;border-top:1px solid var(--line)}
|
|
.b-prevbody h3{font-size:20px;margin:0 0 6px}
|
|
.b-prevbody .btn{pointer-events:none;margin-top:10px}
|
|
.b-note{margin-top:22px;font-size:12.5px;color:var(--muted);line-height:1.6;border-top:1px solid var(--line);padding-top:12px}
|
|
</style></head>
|
|
<body>
|
|
<header class="wrap nav"><a class="brand" href="/suite"><img class="brand-mark" src="/logo.jpg" alt="The RM Circle" width="42" height="42"><span><span id="brandName">RM Circle</span><small>Co-Branded Pages</small></span></a><div class="nav-actions"><a class="btn btn-secondary hide-mobile" href="/suite">← The Suite</a><a class="btn btn-primary" href="/suite/page">My pages</a></div></header>
|
|
<main class="bw">
|
|
<div class="eyebrow" style="color:var(--gold)">CIRCLE SUITE · FASTIGIUM (LEVEL 6)</div>
|
|
<h1>Co-Branded <span class="gold">Pages.</span></h1>
|
|
<p class="lede">Every page you build carries the team's identity by default. From Fastigium it carries yours instead — your name, your monogram, your colour — so what you send people stops looking like a page on someone else's site.</p>
|
|
|
|
<div id="bGate"></div>
|
|
|
|
<div id="bBody" style="display:none">
|
|
<div class="b-card">
|
|
<label class="b-lab" for="bName">Your brand name</label>
|
|
<div class="b-hint">What people should see at the top of your pages. Your own name works perfectly — "Marty Bostick" is a brand.</div>
|
|
<input type="text" id="bName" maxlength="32" placeholder="Bostick Builds">
|
|
|
|
<label class="b-lab" for="bTag">One line under it</label>
|
|
<div class="b-hint">Optional. A short line about what you do, not a slogan.</div>
|
|
<input type="text" id="bTag" maxlength="60" placeholder="Real crypto, real people">
|
|
|
|
<label class="b-lab">Your colour</label>
|
|
<div class="b-hint">Replaces the gold on your pages. Every option here is checked to stay readable on the dark background.</div>
|
|
<div class="b-swatches" id="bSwatches"></div>
|
|
|
|
<label class="b-lab">How it will look</label>
|
|
<div class="b-prev" id="bPrev">
|
|
<div class="b-prevbar"><span class="b-mono" id="bMono">—</span>
|
|
<span><div class="nm" id="bPrevName">Your brand</div><div class="tg" id="bPrevTag">A personal invitation</div></span></div>
|
|
<div class="b-prevbody">
|
|
<h3 id="bPrevHead">You already know two people. <span id="bPrevGold">That's the whole job.</span></h3>
|
|
<span class="btn btn-primary" id="bPrevBtn">Join you →</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="b-row">
|
|
<button id="bSave" class="btn btn-primary">Save my branding</button>
|
|
<button id="bClear" class="btn btn-secondary">Use team branding</button>
|
|
</div>
|
|
<div id="bErr"></div>
|
|
<div id="bOk"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<p class="b-note"><strong style="color:var(--text)">What branding does not change:</strong> the disclaimers at the foot of every page — independent team resource, no income guaranteed, cryptocurrency involves risk — are ours and stay exactly as they are. This is co-branding, not white-labelling; anyone reading your page can still see what they're looking at. <br><br>There's no logo upload on purpose: your monogram is generated from your brand name, so there's no image to moderate and nothing of yours hosted on our domain.</p>
|
|
</main>
|
|
<script src="/suite-brand.js"></script>
|
|
<script src="/chat.js" defer></script>
|
|
<script src="/translate.js" defer></script><script src="/tg-app.js" defer></script><script src="/nav-dash.js" defer></script></body></html>
|