marty/instantadpay
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Overview v3: plated stat cards, trend chips, payout bars, credit donut, view ring, delivery chart

Browse Source 
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
martbost
2026-09-05 06:41:01 -05:00
parent e22021c266
commit fee86d296a
7 changed files with 193 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/my.html
+51 -10
View File
@@ -4,7 +4,7 @@
<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
<title>Member area | InstantAdPay</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap">
<link rel="stylesheet" href="/assets/site.css?v=20260905i">
<link rel="stylesheet" href="/assets/site.css?v=20260905k">
</head>
<body class="bo-body">
@@ -85,11 +85,52 @@
<main class="bo-content">
<div class="pane" id="pane-overview">
<div class="stats" style="margin-top:0">
<div class="stat"><div class="n" id="dbCredits">0</div><div class="l">Ad credits</div><div class="small muted" id="dbCreditsSub"></div></div>
<div class="stat"><div class="n mono" id="dbEarned">0</div><div class="l">POL earned</div></div>
<div class="stat"><div class="n" id="dbBuyers">0</div><div class="l">Qualifying buyers</div></div>
<div class="stat"><div class="n" id="dbTeam">0</div><div class="l">Joined your line</div></div>
<div class="grid" style="grid-template-columns:repeat(auto-fit,minmax(215px,1fr));margin-top:0">
<div class="statx">
<div class="pl"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="8.5"/><path d="M12 7.5v9M9.2 10c0-1 1.2-1.7 2.8-1.7s2.8.7 2.8 1.7-1.2 1.5-2.8 1.7-2.8.7-2.8 1.7 1.2 1.7 2.8 1.7 2.8-.7 2.8-1.7"/></svg></div>
<div><div class="nv" id="dbCredits">0</div><div class="lb">Ad credits</div><span class="chip flat" id="dbCreditsSub"></span></div>
</div>
<div class="statx c-cyan">
<div class="pl"><svg viewBox="0 0 24 24"><rect x="3" y="6" width="18" height="13" rx="2"/><path d="M3 10h18"/><circle cx="16.5" cy="14.5" r="1.4"/></svg></div>
<div><div class="nv mono" id="dbEarned">0</div><div class="lb">POL earned</div><span class="chip" id="dbEarnedChip" hidden></span></div>
</div>
<div class="statx c-violet">
<div class="pl"><svg viewBox="0 0 24 24"><circle cx="12" cy="7" r="3.2"/><circle cx="5" cy="17" r="2.6"/><circle cx="19" cy="17" r="2.6"/><path d="M12 10v3M12 13l-5 2M12 13l5 2"/></svg></div>
<div><div class="nv" id="dbBuyers">0</div><div class="lb">Qualifying buyers</div><span class="chip" id="dbBuyersChip" hidden></span></div>
</div>
<div class="statx c-amber">
<div class="pl"><svg viewBox="0 0 24 24"><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M19 8v6M22 11h-6"/></svg></div>
<div><div class="nv" id="dbTeam">0</div><div class="lb">Joined your line</div><span class="chip warm" id="dbTeamChip" hidden></span></div>
</div>
</div>
<div class="grid c2" style="margin-top:16px">
<div class="card">
<div class="card-head"><h3>Recent payouts</h3><span class="sub" id="chEarnSub">on-chain, newest last</span></div>
<div class="barchart" id="chEarnBars"></div>
<div class="chart-x" id="chEarnX"></div>
</div>
<div class="card">
<div class="card-head"><h3>Credit composition</h3><span class="sub">live balances</span></div>
<div class="donut-wrap">
<svg id="chDonut" width="150" height="150" viewBox="0 0 42 42" role="img" aria-label="Credit composition"></svg>
<div class="donut-legend" id="chDonutLegend"></div>
</div>
</div>
</div>
<div class="grid c2">
<div class="card">
<div class="card-head"><h3>Today's viewing</h3><span class="sub">daily claim progress</span></div>
<div class="donut-wrap">
<svg id="chRing" width="130" height="130" viewBox="0 0 42 42" role="img" aria-label="Daily view progress"></svg>
<div class="donut-legend" id="chRingLegend"></div>
</div>
</div>
<div class="card">
<div class="card-head"><h3>Campaign delivery</h3><span class="sub" id="chCampSub">impressions per campaign</span></div>
<div class="barchart" id="chCampBars"></div>
<div class="chart-x" id="chCampX"></div>
</div>
</div>
<div class="card" id="nextCard">
<h3>Your next move</h3>
@@ -289,9 +330,9 @@
</div>
</div>
<script src="/assets/common.js?v=20260905i"></script>
<script src="/assets/wallet.js?v=20260905i"></script>
<script src="/assets/my.js?v=20260905i"></script>
<script src="/assets/chat.js?v=20260905i"></script>
<script src="/assets/common.js?v=20260905k"></script>
<script src="/assets/wallet.js?v=20260905k"></script>
<script src="/assets/my.js?v=20260905k"></script>
<script src="/assets/chat.js?v=20260905k"></script>
</body>
</html>