From dc0a676afbb78d05c569259fd43e3252d4f69e30 Mon Sep 17 00:00:00 2001
From: fangjie <fangjie@ushareit.com>
Date: Tue, 25 Aug 2026 11:05:50 +0800
Subject: [PATCH] style: blue/white theme, black text, PingFang SC font

---
 index.html | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/index.html b/index.html
index 35a2e6c..fb23ef9 100644
--- a/index.html
+++ b/index.html
@@ -6,9 +6,9 @@
 <title>武汉自投 · 投手投放花费报告</title>
 <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.1/dist/chart.umd.min.js"></script>
 <style>
-:root{--bg:#0f1117;--card:#1a1d27;--line:#2a2e3a;--txt:#e6e8ee;--sub:#9aa0ad;--accent:#5b8cff;--accent2:#ff9f5b;}
+:root{--bg:#ffffff;--card:#f4f8ff;--line:#d6e2f5;--txt:#111111;--sub:#5b6472;--accent:#2f6bff;--accent2:#ff9f5b;}
 *{box-sizing:border-box}
-body{margin:0;background:var(--bg);color:var(--txt);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;line-height:1.5}
+body{margin:0;background:var(--bg);color:var(--txt);font-family:"PingFang SC","PingFang TC","Apple LiGothic","STHeiti","Hiragino Sans GB",-apple-system,BlinkMacSystemFont,"Microsoft YaHei",sans-serif;line-height:1.5}
 .wrap{max-width:1080px;margin:0 auto;padding:28px 20px 60px}
 h1{font-size:24px;margin:0 0 4px}
 .sub{color:var(--sub);font-size:13px;margin-bottom:22px}
@@ -22,12 +22,12 @@ table{width:100%;border-collapse:collapse;font-size:13px}
 th,td{padding:9px 10px;text-align:left;border-bottom:1px solid var(--line)}
 th{color:var(--sub);font-weight:500;font-size:12px}
 td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
-.pkg{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;color:#cfd3dd}
+.pkg{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;color:#333a45}
 .buyer-name{font-weight:600}
 details{margin-top:6px}
 summary{cursor:pointer;color:var(--accent);font-size:12px}
 .foot{color:var(--sub);font-size:12px;margin-top:30px;border-top:1px solid var(--line);padding-top:14px}
-.badge{display:inline-block;background:#2a2e3a;color:var(--sub);border-radius:6px;padding:2px 8px;font-size:11px;margin-left:8px}
+.badge{display:inline-block;background:#e6eefc;color:var(--sub);border-radius:6px;padding:2px 8px;font-size:11px;margin-left:8px}
 .chartbox{position:relative;height:300px}
 </style>
 </head>
@@ -52,8 +52,8 @@ function render(d){
   const cards=[['投手数',buyers.length],['投放花费合计',fmt(d.grand_total)],['覆盖 Adpingid 数',d.week34_id_count],['花费最高投手',buyers[0].name]];
   document.getElementById('cards').innerHTML=cards.map(c=>'<div class="card"><div class="k">'+c[0]+'</div><div class="v">'+c[1]+'</div></div>').join('');
   const palette=['#5b8cff','#ff9f5b','#4dd6a8','#c78bff','#ff6b81','#f5c451'];
-  new Chart(document.getElementById('spendChart'),{type:'bar',data:{labels:buyers.map(b=>b.name),datasets:[{label:'投放花费',data:buyers.map(b=>b.total),backgroundColor:buyers.map((b,i)=>palette[i%palette.length])}]},options:{indexAxis:'y',plugins:{legend:{display:false}},scales:{x:{ticks:{color:'#9aa0ad'},grid:{color:'#2a2e3a'}},y:{ticks:{color:'#e6e8ee'},grid:{display:false}}}}});
-  new Chart(document.getElementById('pkgChart'),{type:'bar',data:{labels:buyers.map(b=>b.name),datasets:[{label:'主要Package花费',data:buyers.map(b=>b.pkgs[0].spend),backgroundColor:'#4dd6a8'}]},options:{plugins:{legend:{display:false},tooltip:{callbacks:{afterLabel:(ctx)=>buyers[ctx.dataIndex].pkgs[0].pkg}}},scales:{x:{ticks:{color:'#e6e8ee'},grid:{display:false}},y:{ticks:{color:'#9aa0ad'},grid:{color:'#2a2e3a'}}}}});
+  new Chart(document.getElementById('spendChart'),{type:'bar',data:{labels:buyers.map(b=>b.name),datasets:[{label:'投放花费',data:buyers.map(b=>b.total),backgroundColor:buyers.map((b,i)=>palette[i%palette.length])}]},options:{indexAxis:'y',plugins:{legend:{display:false}},scales:{x:{ticks:{color:'#5b6472'},grid:{color:'#d6e2f5'}},y:{ticks:{color:'#111111'},grid:{display:false}}}}});
+  new Chart(document.getElementById('pkgChart'),{type:'bar',data:{labels:buyers.map(b=>b.name),datasets:[{label:'主要Package花费',data:buyers.map(b=>b.pkgs[0].spend),backgroundColor:'#4dd6a8'}]},options:{plugins:{legend:{display:false},tooltip:{callbacks:{afterLabel:(ctx)=>buyers[ctx.dataIndex].pkgs[0].pkg}}},scales:{x:{ticks:{color:'#111111'},grid:{display:false}},y:{ticks:{color:'#5b6472'},grid:{color:'#d6e2f5'}}}}});
   document.getElementById('tables').innerHTML=buyers.map(b=>{
     const rows=b.pkgs.map(p=>'<tr><td class="pkg">'+p.pkg+'</td><td class="num">'+fmt(p.spend)+'</td></tr>').join('');
     return '<div style="margin-bottom:18px"><div class="buyer-name">'+b.name+'　<span style="color:var(--sub);font-weight:400">合计 '+fmt(b.total)+'　·　主要订单 '+b.pkgs[0].pkg+'</span></div><details><summary>展开 '+b.pkgs.length+' 个 Package 明细</summary><table><thead><tr><th>Package</th><th class="num">花费</th></tr></thead><tbody>'+rows+'</tbody></table></details></div>';