From c10af1d1e73a70d1ab1645eea7921c57a320baf6 Mon Sep 17 00:00:00 2001 From: martbost Date: Fri, 4 Sep 2026 16:39:23 -0500 Subject: [PATCH] Members area menu: Overview / My line / Campaigns / Earnings / Wallet Hash-routed pane tabs replace the single scrolling page. Overview keeps the stat cards, next-move guidance, and levels; My line holds the invite/share kit and roster; Campaigns gains a pre-purchase gate card; Earnings gains a pre-activation explainer; Wallet gathers account, credits, link, activate, logout. Deep links (/my#campaigns) land on the right pane. Browser-verified tab exclusivity, hash sync, deep links, and 390px overflow. Assets v=20260904q. Co-Authored-By: Claude Fable 5 --- public/assets/my.js | 19 ++++ public/assets/site.css | 7 ++ public/contract.html | 8 +- public/index.html | 10 +- public/ledger.html | 8 +- public/my.html | 231 +++++++++++++++++++++++------------------ 6 files changed, 167 insertions(+), 116 deletions(-) diff --git a/public/assets/my.js b/public/assets/my.js index c8563c7..c99e0d9 100644 --- a/public/assets/my.js +++ b/public/assets/my.js @@ -58,12 +58,31 @@ } catch (e) {} } + // ── members-area menu: hash-routed panes ────────────── + const PANES = ['overview', 'line', 'campaigns', 'earnings', 'wallet']; + function setPane(name) { + if (!PANES.includes(name)) name = 'overview'; + for (const p of PANES) { + const el = $('pane-' + p); + if (el) el.hidden = p !== name; + } + document.querySelectorAll('.subnav [data-pane]').forEach(b => + b.classList.toggle('on', b.dataset.pane === name)); + if (location.hash !== '#' + name) history.replaceState(null, '', '#' + name); + } + document.querySelectorAll('.subnav [data-pane]').forEach(b => + b.addEventListener('click', () => setPane(b.dataset.pane))); + window.addEventListener('hashchange', () => setPane(location.hash.slice(1))); + async function render() { const me = await IAP.refreshNavWallet(); const signedIn = me && me.signedIn; $('authArea').hidden = !!signedIn; $('memberArea').hidden = !signedIn; if (!signedIn) return; + setPane(location.hash.slice(1) || 'overview'); + $('campGate').hidden = !!me.memberId; + $('earnGate').hidden = !!me.memberId; loadDashboard(); const who = []; diff --git a/public/assets/site.css b/public/assets/site.css index 7a1fb19..9fe0eee 100644 --- a/public/assets/site.css +++ b/public/assets/site.css @@ -222,6 +222,13 @@ input[type=range]{padding:0;border:0;background:transparent;accent-color:var(--m input:focus,select:focus{border-color:var(--mint)} :focus-visible{outline:2px solid var(--mint);outline-offset:2px} .hero-note{font-family:var(--mono);font-size:12px;color:var(--muted);margin-top:26px} +/* member sub-navigation */ +.subnav{display:flex;gap:6px;flex-wrap:wrap;background:rgba(16,28,24,.7);border:1px solid var(--line); + border-radius:999px;padding:6px 8px;width:fit-content;margin:0 0 22px} +.subnav button{background:transparent;border:0;color:var(--muted);font:600 13.5px var(--disp); + padding:8px 16px;border-radius:999px;cursor:pointer} +.subnav button:hover{color:var(--ink)} +.subnav button.on{color:var(--mint-ink);background:var(--mint)} /* member dashboard: qualification progress + roster */ .qualbar{position:relative;height:12px;border-radius:999px;background:rgba(4,8,7,.7);border:1px solid var(--line-strong); margin:26px 0 30px;max-width:520px} diff --git a/public/contract.html b/public/contract.html index 38439ba..65eb61f 100644 --- a/public/contract.html +++ b/public/contract.html @@ -5,7 +5,7 @@ The contract | InstantAdPay - +
@@ -129,8 +129,8 @@
Advertising services with a performance referral program. Not an investment product; no income guarantees. Crypto transactions are irreversible. Never spend what you cannot afford.
- - - + + + diff --git a/public/index.html b/public/index.html index 97d2e28..23e1cb8 100644 --- a/public/index.html +++ b/public/index.html @@ -5,7 +5,7 @@ InstantAdPay: advertise and earn, locked in code - + @@ -398,9 +398,9 @@ - - - - + + + + diff --git a/public/ledger.html b/public/ledger.html index 9cbdc6c..e154c02 100644 --- a/public/ledger.html +++ b/public/ledger.html @@ -5,7 +5,7 @@ Live ledger | InstantAdPay - +
@@ -25,8 +25,8 @@
InstantAdPay · how it works · contract source ↗
- - - + + + diff --git a/public/my.html b/public/my.html index 997520f..e8b4e3a 100644 --- a/public/my.html +++ b/public/my.html @@ -4,11 +4,11 @@ My account | InstantAdPay - +
-
+

My account

Join free with your email. Your wallet only comes out when you buy a package or switch on payouts, and it stays yours the whole time.

@@ -46,123 +46,148 @@