martbost
8964dfcf97
Janie's screenshot showed the X / chevron / share / kebab chrome of TELEGRAM'S in-app browser, not Trust's DApp browser. She tapped her sponsor's link in a Telegram chat, Telegram opened it in its own webview, and that webview can never hold a wallet. The page said "no wallet in this browser", she said she was using Trust — both true, completely at cross purposes. Our advice made it worse: "open your wallet's browser and type the address" is useless to someone whose whole reason for being on the page is that they tapped a link. Now we name the browser they are actually in — Telegram, Facebook, Instagram, LINE, Messenger, X, or a generic Android WebView — say plainly that it cannot hold a wallet and that this is not their fault, and give them the one useful thing: a button that copies the address to the clipboard so they can paste it into Trust. There is an execCommand fallback because older webviews have no clipboard API, and leaving a button that silently does nothing would be worse than not having one. Detection deliberately requires the absence of window.ethereum before calling something an in-app browser: wallet browsers ARE WebViews, and those are exactly the ones that work. Verified against Telegram, Android WebView, Trust (correctly ignored) and mobile Safari (correctly ignored). This will hit far more members than Janie — every link tapped inside a chat app lands in the same trap. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
55 lines
5.0 KiB
HTML
55 lines
5.0 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="The Circle Suite — the marketing toolkit licensed to every paid position on our team. Connect your wallet and your level lights up your tools."><title>The Circle Suite | RM Circle Team Build</title><link rel="icon" type="image/png" href="/favicon.png"><link rel="stylesheet" href="/styles.css">
|
|
<style>
|
|
.su-wrap{max-width:1020px;margin:0 auto;padding:24px 20px 70px}
|
|
.su-hero{text-align:center;max-width:780px;margin:0 auto 10px}
|
|
.su-hero h1{font-size:clamp(30px,5vw,44px);margin:8px 0 10px}
|
|
.su-hero p{color:var(--muted);line-height:1.65}
|
|
#suPips{display:flex;gap:9px;justify-content:center;align-items:center;margin:18px 0 6px}
|
|
#suPips .lab{color:var(--muted);font-weight:800;font-size:12px;letter-spacing:2px;margin-right:4px}
|
|
.su-pip{width:15px;height:15px;border-radius:50%;background:rgba(255,255,255,.06);border:2px solid var(--line);opacity:.6}
|
|
.su-pip.on{background:var(--teal);border-color:var(--teal);opacity:1}
|
|
.su-pip.gold{background:var(--gold);border-color:var(--gold);opacity:1}
|
|
#suConnect{margin:16px auto 6px;display:block}
|
|
#suMe{display:none;border:2px solid var(--teal);border-radius:12px;padding:12px 18px;margin:14px auto 6px;max-width:640px;font-size:15px;line-height:1.6;text-align:center}
|
|
#suMe b{color:var(--gold)}
|
|
#suErr{display:none;color:#f0a05a;text-align:center;margin:10px auto;max-width:640px;font-size:14px}
|
|
.su-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:14px;margin-top:26px}
|
|
.su-tile{background:var(--card,#0d2236);border:1px solid var(--line,#24425d);border-radius:14px;padding:16px 18px;position:relative;
|
|
display:flex;flex-direction:column;gap:6px;min-height:150px;transition:border-color .2s}
|
|
.su-tile .ico{font-size:26px;line-height:1}
|
|
.su-tile h3{font-size:16.5px;margin:2px 0 0}
|
|
.su-tile p{font-size:13px;color:var(--muted);line-height:1.5;margin:0;flex:1}
|
|
.su-tile .badge{position:absolute;top:12px;right:12px;font-size:10px;font-weight:800;letter-spacing:.08em;
|
|
border-radius:999px;padding:2px 9px;border:1px solid var(--line);color:var(--muted)}
|
|
.su-tile.open{border-color:rgba(78,214,203,.55)}
|
|
.su-tile.open .badge{border-color:var(--teal);color:var(--teal)}
|
|
.su-tile.locked{opacity:.62}
|
|
.su-tile.locked .badge{border-color:var(--gold);color:var(--gold)}
|
|
.su-tile a.go{color:var(--teal);font-weight:700;font-size:13.5px;text-decoration:none;margin-top:4px}
|
|
.su-tile .dev{font-size:10px;font-weight:800;letter-spacing:.08em;color:var(--muted);border:1px dashed var(--line);border-radius:999px;padding:2px 9px;align-self:flex-start}
|
|
.su-lvhead{grid-column:1/-1;display:flex;align-items:center;gap:12px;margin-top:10px}
|
|
.su-lvhead .n{font-family:Georgia,serif;font-weight:700;color:var(--gold);font-size:20px}
|
|
.su-lvhead .nm{font-weight:800;letter-spacing:.12em;font-size:12.5px;color:var(--muted);text-transform:uppercase}
|
|
.su-lvhead .rule{flex:1;height:1px;background:var(--line)}
|
|
.su-foot{margin-top:34px;padding-top:14px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted);line-height:1.6;text-align:center}
|
|
</style></head>
|
|
<body>
|
|
<header class="wrap nav"><a class="brand" href="/"><img class="brand-mark" src="/logo.jpg" alt="The RM Circle" width="42" height="42"><span><span id="brandName">RM Circle</span><small>The Circle Suite</small></span></a><div class="nav-actions"><a class="btn btn-secondary hide-mobile" href="/tools">Promo Tools</a><a class="btn btn-primary" href="/">Home</a></div></header>
|
|
<main class="su-wrap">
|
|
<div class="su-hero">
|
|
<div class="eyebrow" style="color:var(--gold)">THE PRODUCT · YOUR POSITION IS YOUR LICENSE</div>
|
|
<h1>The Circle <span class="gold">Suite.</span></h1>
|
|
<p>Every paid position on our team is a license to this toolkit. Connect the wallet that holds your position — one free signature, it can't move funds — and your level lights up your tools. Each upgrade extends your license, automatically, straight from the contract.</p>
|
|
<div id="suPips"><span class="lab">YOUR LEVEL</span></div>
|
|
<button id="suConnect" class="btn btn-primary">🔑 Connect wallet — light up my tools</button>
|
|
<div id="suMe"></div>
|
|
<div id="suErr"></div>
|
|
</div>
|
|
<div id="suGrid" class="su-grid"></div>
|
|
<div class="su-foot">The Suite is included with team membership — never sold separately, never an extra cost. Tools marked "in development" ship in the order the team builds them; only what you can click today is promised today. Independent team resource · No income is guaranteed · Cryptocurrency involves risk. <a href="/how-pay-works#exact-costs" style="color:var(--teal)">Level costs, straight from the contract →</a></div>
|
|
</main>
|
|
<script src="/rmc-wallet.js"></script>
|
|
<script src="/inapp-browser.js"></script><script src="/suite.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>
|