dekun/crypto_monitor
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(hub): color-code monitor card strategy stat chips

Browse Source 
Use shared cyan for breakout/fib keys, purple for watch keys, green for trends, and orange for roll groups.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-06-03 23:30:33 +08:00
parent 98038b1945
commit 2c01d11fe1
3 changed files with 39 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
manual_trading_hub/static/app.css
+28 -2
View File
@@ -1296,9 +1296,35 @@ body.market-chart-fs-open {
border-radius: 6px; border-radius: 6px;
font-size: 11px; font-size: 11px;
line-height: 1.3; line-height: 1.3;
border: 1px solid transparent;
}
/* 突破 + 斐波 */
.card-stat-chip.card-stat-key-breakout {
color: var(--accent); color: var(--accent);
background: var(--accent-dim); background: rgba(0, 212, 255, 0.14);
border: 1px solid var(--border-soft); border-color: rgba(0, 212, 255, 0.38);
}
/* 关键位监控（阻力/支撑等） */
.card-stat-chip.card-stat-key-watch {
color: #b8a0ff;
background: rgba(123, 97, 255, 0.18);
border-color: rgba(123, 97, 255, 0.42);
}
/* 趋势回调 */
.card-stat-chip.card-stat-trend {
color: var(--green);
background: rgba(0, 255, 157, 0.1);
border-color: rgba(0, 255, 157, 0.38);
}
/* 顺势加仓 */
.card-stat-chip.card-stat-roll {
color: #ffb020;
background: rgba(255, 176, 32, 0.14);
border-color: rgba(255, 176, 32, 0.42);
} }
.hub-tile .card-strategy-stats { .hub-tile .card-strategy-stats {
manual_trading_hub/static/app.js
+9 -6
View File
@@ -1652,19 +1652,22 @@
const chips = []; const chips = [];
if (caps.includes("key")) { if (caps.includes("key")) {
const kc = countKeyMonitorsByBucket(hm.keys || []); const kc = countKeyMonitorsByBucket(hm.keys || []);
if (kc.breakout > 0) chips.push(`突破 ${kc.breakout}`); if (kc.breakout > 0) chips.push({ kind: "key-breakout", label: `突破 ${kc.breakout}` });
if (kc.fib > 0) chips.push(`斐波 ${kc.fib}`); if (kc.fib > 0) chips.push({ kind: "key-breakout", label: `斐波 ${kc.fib}` });
if (kc.watch > 0) chips.push(`监控 ${kc.watch}`); if (kc.watch > 0) chips.push({ kind: "key-watch", label: `监控 ${kc.watch}` });
} }
if (caps.includes("trend")) { if (caps.includes("trend")) {
const trendN = Array.isArray(hm.trends) ? hm.trends.length : 0; const trendN = Array.isArray(hm.trends) ? hm.trends.length : 0;
if (trendN > 0) chips.push(`趋势回调 ${trendN}`); if (trendN > 0) chips.push({ kind: "trend", label: `趋势回调 ${trendN}` });
} }
const rollN = Array.isArray(hm.rolls) ? hm.rolls.length : 0; const rollN = Array.isArray(hm.rolls) ? hm.rolls.length : 0;
if (rollN > 0) chips.push(`顺势加仓 ${rollN}`); if (rollN > 0) chips.push({ kind: "roll", label: `顺势加仓 ${rollN}` });
if (!chips.length) return ""; if (!chips.length) return "";
return `<div class="card-strategy-stats">${chips return `<div class="card-strategy-stats">${chips
.map((label) => `<span class="card-stat-chip">${esc(label)}</span>`) .map(
(c) =>
`<span class="card-stat-chip card-stat-${esc(c.kind)}">${esc(c.label)}</span>`
)
.join("")}</div>`; .join("")}</div>`;
} }
manual_trading_hub/static/index.html
+2 -2
View File
@@ -8,7 +8,7 @@
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin /> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&family=Orbitron:wght@500;600;700&display=swap" rel="stylesheet" media="print" onload="this.media='all'" /> <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&family=Orbitron:wght@500;600;700&display=swap" rel="stylesheet" media="print" onload="this.media='all'" />
<noscript><link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&family=Orbitron:wght@500;600;700&display=swap" rel="stylesheet" /></noscript> <noscript><link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&family=Orbitron:wght@500;600;700&display=swap" rel="stylesheet" /></noscript>
<link rel="stylesheet" href="/assets/app.css?v=20260604-hub-card-stats" /> <link rel="stylesheet" href="/assets/app.css?v=20260604-hub-stat-colors" />
</head> </head>
<body> <body>
<div class="app-bg" aria-hidden="true"></div> <div class="app-bg" aria-hidden="true"></div>
@@ -246,6 +246,6 @@
<div id="toast"></div> <div id="toast"></div>
<script src="https://unpkg.com/lightweight-charts@4.2.0/dist/lightweight-charts.standalone.production.js"></script> <script src="https://unpkg.com/lightweight-charts@4.2.0/dist/lightweight-charts.standalone.production.js"></script>
<script src="/assets/chart.js?v=20260603-hub-binance-tick"></script> <script src="/assets/chart.js?v=20260603-hub-binance-tick"></script>
<script src="/assets/app.js?v=20260604-hub-card-stats"></script> <script src="/assets/app.js?v=20260604-hub-stat-colors"></script>
</body> </body>
</html> </html>