leefer/xiaobaifupan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: apply B-147 visual tokens to remaining market data pages

Browse Source 
Unify ladder, themes, rotation, auction, dragon-tiger and popularity with shared tokens, left-aligned first columns, and table density.

Co-authored-by: Cursor <cursoragent@cursor.com>
Co-authored-by: multica-agent <github@multica.ai>
This commit is contained in:
MS-01-Codex
2026-08-20 04:34:36 +08:00
co-authored by Cursor multica-agent
parent 6ab910eeea
commit ad08d309c6
16 changed files with 279 additions and 215 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/config/architecture-inventory.json
+9 -9
View File
@@ -383,12 +383,12 @@
"/pages/market/foundation.css?v=20260806-1",
"/pages/sentiment/foundation.css?v=20260820-2",
"/pages/pools/foundation.css?v=20260820-1",
"/pages/ladder/foundation.css?v=20260806-1",
"/pages/rotation/foundation.css?v=20260806-1",
"/pages/auction/foundation.css?v=20260806-2",
"/pages/themes/foundation.css?v=20260806-1",
"/pages/popularity/foundation.css?v=20260806-1",
"/pages/dragon-tiger/foundation.css?v=20260806-1",
"/pages/ladder/foundation.css?v=20260820-1",
"/pages/rotation/foundation.css?v=20260820-1",
"/pages/auction/foundation.css?v=20260820-1",
"/pages/themes/foundation.css?v=20260820-1",
"/pages/popularity/foundation.css?v=20260820-1",
"/pages/dragon-tiger/foundation.css?v=20260820-1",
"/pages/screener/foundation.css?v=20260806-2",
"/pages/mentor/foundation.css?v=20260820-2",
"/pages/heaven/foundation.css?v=20260806-2",
@@ -471,8 +471,8 @@
},
{
"path": "frontend/pages/auction/foundation.css",
"bytes": 34990,
"lines": 2409
"bytes": 35329,
"lines": 2420
},
{
"path": "database.py",
@@ -736,7 +736,7 @@
},
{
"path": "frontend/pages/themes/page.html",
"bytes": 3309,
"bytes": 3316,
"lines": 55
},
{
app/frontend/index.html
+6 -6
View File
@@ -30,12 +30,12 @@
<link rel="stylesheet" href="/pages/market/foundation.css?v=20260806-1">
<link rel="stylesheet" href="/pages/sentiment/foundation.css?v=20260820-2">
<link rel="stylesheet" href="/pages/pools/foundation.css?v=20260820-1">
<link rel="stylesheet" href="/pages/ladder/foundation.css?v=20260806-1">
<link rel="stylesheet" href="/pages/rotation/foundation.css?v=20260806-1">
<link rel="stylesheet" href="/pages/auction/foundation.css?v=20260806-2">
<link rel="stylesheet" href="/pages/themes/foundation.css?v=20260806-1">
<link rel="stylesheet" href="/pages/popularity/foundation.css?v=20260806-1">
<link rel="stylesheet" href="/pages/dragon-tiger/foundation.css?v=20260806-1">
<link rel="stylesheet" href="/pages/ladder/foundation.css?v=20260820-1">
<link rel="stylesheet" href="/pages/rotation/foundation.css?v=20260820-1">
<link rel="stylesheet" href="/pages/auction/foundation.css?v=20260820-1">
<link rel="stylesheet" href="/pages/themes/foundation.css?v=20260820-1">
<link rel="stylesheet" href="/pages/popularity/foundation.css?v=20260820-1">
<link rel="stylesheet" href="/pages/dragon-tiger/foundation.css?v=20260820-1">
<link rel="stylesheet" href="/pages/screener/foundation.css?v=20260806-2">
<link rel="stylesheet" href="/pages/mentor/foundation.css?v=20260820-2">
<link rel="stylesheet" href="/pages/heaven/foundation.css?v=20260806-2">
app/frontend/pages.config.js
+8 -8
View File
@@ -45,12 +45,12 @@
["pools", "/pages/pools/page.html?v=20260820-1", ["limitPool", "brokenView", "downView", "yesterdayView", "performanceView"]],
["sentiment", "/pages/sentiment/page.html?v=20260803-1", ["sentimentCycleView"]],
["heaven", "/pages/heaven/page.html?v=20260803-1", ["heavenView"]],
["ladder", "/pages/ladder/page.html?v=20260803-1", ["ladderView"]],
["ladder", "/pages/ladder/page.html?v=20260820-1", ["ladderView"]],
["screener", "/pages/screener/page.html?v=20260804-1", ["screenerView", "screenerTrackingView"]],
["mentor", "/pages/mentor/page.html?v=20260820-1", ["mentorView"]],
["rotation", "/pages/rotation/page.html?v=20260803-1", ["rotationView"]],
["rotation", "/pages/rotation/page.html?v=20260820-1", ["rotationView"]],
["auction", "/pages/auction/page.html?v=20260803-1", ["auctionView"]],
["themes", "/pages/themes/page.html?v=20260803-1", ["themeLibraryView"]],
["themes", "/pages/themes/page.html?v=20260820-1", ["themeLibraryView"]],
["popularity", "/pages/popularity/page.html?v=20260803-1", ["popularityView"]],
["dragon_tiger", "/pages/dragon-tiger/page.html?v=20260803-1", ["dragonView"]],
["review", "/pages/review/page.html?v=20260803-1", ["reviewWorkspaceView"]],
@@ -74,12 +74,12 @@
"/pages/market/preview.js?v=20260806-1",
"/pages/market/search.js?v=20260803-1",
"/pages/market/bindings.js?v=20260803-1",
"/pages/ladder/page.js?v=20260729-1",
"/pages/rotation/page.js?v=20260729-1",
"/pages/ladder/page.js?v=20260820-1",
"/pages/rotation/page.js?v=20260820-1",
"/pages/auction/page.js?v=20260729-1",
"/pages/themes/page.js?v=20260729-1",
"/pages/popularity/page.js?v=20260729-1",
"/pages/dragon-tiger/page.js?v=20260806-1",
"/pages/themes/page.js?v=20260820-1",
"/pages/popularity/page.js?v=20260820-1",
"/pages/dragon-tiger/page.js?v=20260820-1",
"/pages/screener/page.js?v=20260806-1",
"/pages/mentor/page.js?v=20260820-1",
"/pages/heaven/page.js?v=20260729-1",
app/frontend/pages/auction/foundation.css
Vendored
+47 -36
View File
@@ -1,8 +1,8 @@
/* Canonical CSS owner: auction. Historical layers consolidated 2026-08-02. */
#auctionView .section-toolbar h2 {
font-size: 17px;
font-size: var(--font-size-page-title);
font-weight: 800;
font-weight: var(--font-weight-semibold);
}
@media (max-width: 767px) {
@@ -354,9 +354,9 @@
}
.auction-phase-notice[data-phase="archive"] {
background: rgb(238, 242, 246);
background: var(--surface-muted);
color: rgb(89, 101, 116);
color: var(--text-2);
}
.auction-phase-marker {
@@ -374,7 +374,7 @@
.auction-table {
min-width: 860px;
font-size: 12.5px;
font-size: var(--font-size-table);
}
.auction-table tbody tr:hover td {
@@ -462,7 +462,7 @@
transition: opacity var(--motion-fast) ease;
background: rgb(201, 214, 238);
background: var(--accent-soft);
}
.auction-amount-average {
@@ -522,7 +522,7 @@
}
.auction-table td {
height: 44px;
height: 40px;
padding-right: 12px;
@@ -530,7 +530,7 @@
border-right: 0px;
border-bottom-color: rgb(232, 237, 241);
border-bottom-color: var(--border);
}
.auction-table th {
@@ -540,13 +540,13 @@
border-right: 0px;
height: 38px;
height: 36px;
color: rgb(107, 114, 128);
color: var(--text-2);
font-size: 12px;
font-size: var(--font-size-caption);
border-bottom-color: rgb(232, 237, 241);
border-bottom-color: var(--border);
background: var(--table-header);
}
@@ -694,9 +694,9 @@
color: var(--r2-ink);
font-size: 17px;
font-size: var(--font-size-page-title);
font-weight: 800;
font-weight: var(--font-weight-semibold);
letter-spacing: 0px;
}
@@ -812,13 +812,13 @@
100% {
opacity: 0.42;
box-shadow: rgba(37, 99, 235, 0.18) 0px 0px 0px 0px;
box-shadow: 0 0 0 0 var(--focus-ring);
}
50% {
opacity: 1;
box-shadow: rgba(37, 99, 235, 0) 0px 0px 0px 4px;
box-shadow: 0 0 0 4px transparent;
}
}
@@ -896,7 +896,9 @@
.auction-export-button,
.auction-refresh-button {
min-height: 30px;
min-height: 32px;
height: 32px;
display: inline-flex;
@@ -906,17 +908,17 @@
gap: 5px;
padding: 5px 11px;
padding: 0 12px;
border: 1px solid var(--r2-line);
border: 1px solid var(--border-strong);
border-radius: 7px;
border-radius: 8px;
background: var(--surface);
color: var(--text-primary);
font-size: 12px;
font-size: var(--font-size-label);
font-weight: 500;
@@ -1144,7 +1146,7 @@
.auction-search-v2 {
min-width: 0px;
height: 31px;
height: 32px;
display: flex;
@@ -1154,9 +1156,9 @@
padding: 0px 9px;
border: 1px solid var(--r2-line);
border: 1px solid var(--border-strong);
border-radius: 7px;
border-radius: 8px;
background: var(--surface);
}
@@ -1193,7 +1195,7 @@
.auction-filter-segments button:focus-visible,
.auction-refresh-button:focus-visible,
.auction-tabs-v2 button:focus-visible {
outline: rgba(37, 99, 235, 0.28) solid 2px;
outline: 2px solid var(--accent);
outline-offset: 2px;
}
@@ -1219,7 +1221,7 @@
border-collapse: collapse;
font-size: 12.5px;
font-size: var(--font-size-table);
}
.auction-table-v2 thead th {
@@ -1229,12 +1231,16 @@
z-index: 2;
height: 35px;
height: 36px;
padding: 0 12px;
background: var(--table-header);
color: var(--r2-sub);
font-size: var(--font-size-caption);
font-weight: 600;
text-align: left;
@@ -1242,6 +1248,11 @@
white-space: nowrap;
}
.auction-table-v2 thead th:first-child,
.auction-table-v2 tbody td:first-child {
text-align: left;
}
.auction-table-v2 thead th.number {
text-align: right;
}
@@ -1269,7 +1280,9 @@
}
.auction-table-v2 tbody td {
height: 47px;
height: 40px;
padding: 0 12px;
border-bottom: 1px solid var(--r2-line-soft);
@@ -1819,7 +1832,7 @@
border-radius: 3px 3px 0px 0px;
background: rgb(201, 214, 238);
background: var(--accent-soft);
transition: opacity 180ms, transform 180ms;
@@ -1915,7 +1928,7 @@
border-radius: 2px;
background: rgb(201, 214, 238);
background: var(--accent-soft);
}
.auction-volume-legend i.current {
@@ -2138,11 +2151,9 @@
}
.auction-table-v2 tbody td {
height: 43px;
height: 40px;
padding-top: 6px;
padding-bottom: 6px;
padding: 0 12px;
}
}
@@ -2165,9 +2176,9 @@
}
.auc-head h2 {
font-size: 17px;
font-size: var(--font-size-page-title);
font-weight: 800;
font-weight: var(--font-weight-semibold);
}
.auc-grid {
app/frontend/pages/dragon-tiger/foundation.css
Vendored
+33 -19
View File
@@ -82,7 +82,7 @@
}
.dragon-operation-table th {
background: rgb(232, 240, 244);
background: var(--table-header);
}
.seat-cell {
@@ -952,6 +952,10 @@
margin: 0px;
color: var(--r2-ink);
font-size: var(--font-size-page-title);
font-weight: var(--font-weight-semibold);
}
.dragon-title-v2 > span {
@@ -991,7 +995,7 @@
align-items: center;
min-height: 34px;
min-height: 32px;
padding: 3px;
@@ -1003,19 +1007,19 @@
}
.dragon-view-tabs-v2 button {
min-height: 27px;
min-height: 26px;
padding: 0px 13px;
border: 0px;
border-radius: 5px;
border-radius: 6px;
background: transparent;
color: var(--r2-sub);
font-size: 11px;
font-size: var(--font-size-label);
cursor: pointer;
}
@@ -1037,11 +1041,15 @@
}
.dragon-action-v2 {
min-height: 34px;
min-height: 32px;
padding: 0px 11px;
height: 32px;
border-radius: 7px;
padding: 0px 12px;
border-radius: 8px;
font-size: var(--font-size-label);
}
.dragon-action-v2 .lucide {
@@ -1101,9 +1109,9 @@
}
.dragon-summary-v2 .dragon-metric span {
color: var(--r2-sub);
color: var(--text-3);
font-size: 11px;
font-size: var(--font-size-caption);
}
.dragon-summary-v2 .dragon-metric strong {
@@ -1111,9 +1119,9 @@
color: var(--r2-ink);
font-size: 18px;
font-size: var(--font-size-metric);
font-weight: 750;
font-weight: var(--font-weight-semibold);
font-variant-numeric: tabular-nums;
}
@@ -1245,7 +1253,7 @@
width: 230px;
height: 33px;
height: 32px;
flex: 0 0 auto;
@@ -1253,9 +1261,9 @@
padding: 0px 10px;
border: 1px solid rgb(216, 221, 229);
border: 1px solid var(--border-strong);
border-radius: 7px;
border-radius: 8px;
color: var(--r2-faint);
@@ -1263,9 +1271,9 @@
}
.dragon-search-v2:focus-within {
border-color: rgb(150, 181, 242);
border-color: var(--accent);
box-shadow: rgba(37, 99, 235, 0.09) 0px 0px 0px 3px;
box-shadow: 0 0 0 2px var(--focus-ring);
}
.dragon-search-v2 .lucide {
@@ -1421,7 +1429,7 @@
#dragonView .dragon-operation-table :is(th, td).row-number {
padding-inline: 8px;
text-align: center;
text-align: left;
}
#dragonView .dragon-operation-table td.stock-code {
@@ -1435,6 +1443,12 @@
z-index: 2;
height: 36px;
padding: 0 12px;
font-size: var(--font-size-caption);
background: var(--surface-subtle);
}
@@ -2389,7 +2403,7 @@ table.tbl {
border-collapse: collapse;
font-size: 12.5px;
font-size: var(--font-size-table);
}
.tbl .num {
app/frontend/pages/dragon-tiger/page.js
+2 -2
View File
@@ -299,10 +299,10 @@ function renderDragonTraderDetail(trader) {
<div class="trader-operations table-frame tbl-wrap">
<table class="data-table tbl dragon-operation-table">
<colgroup><col class="dragon-col-index"><col class="dragon-col-stock"><col class="dragon-col-direction"><col class="dragon-col-number"><col class="dragon-col-number"><col class="dragon-col-number"><col class="dragon-col-number"><col class="dragon-col-seat"><col class="dragon-col-reason"></colgroup>
<thead><tr><th class="row-number num">序号</th><th>股票</th><th>方向</th><th class="number num">涨幅（%）</th><th class="number num">买入（百万）</th><th class="number num">卖出（百万）</th><th class="number num">净额（百万）</th><th>关联席位</th><th class="reason-column">标签 / 上榜原因</th></tr></thead>
<thead><tr><th class="row-number">序号</th><th>股票</th><th>方向</th><th class="number num">涨幅（%）</th><th class="number num">买入（百万）</th><th class="number num">卖出（百万）</th><th class="number num">净额（百万）</th><th>关联席位</th><th class="reason-column">标签 / 上榜原因</th></tr></thead>
<tbody>${(trader.operations || []).map((operation, index) => `
<tr data-code="${escapeHtml(operation.code)}">
<td class="row-number num">${index + 1}</td>
<td class="row-number">${index + 1}</td>
<td><strong class="sname">${escapeHtml(operation.name)}</strong><span class="scode">${escapeHtml(operation.code)}</span></td>
<td><span class="direction-label ${changeClass(operation.net_buy_million)}">${escapeHtml(operation.direction)}</span></td>
<td class="number num ${operation.change == null ? "" : changeClass(operation.change)}">${operation.change == null ? "" : signed(operation.change)}</td>
app/frontend/pages/ladder/foundation.css
Vendored
+26 -18
View File
@@ -14,7 +14,7 @@
padding: 9px 4px;
border-bottom: 1px solid rgb(232, 236, 239);
border-bottom: 1px solid var(--border);
cursor: pointer;
}
@@ -128,7 +128,7 @@
gap: 5px;
background: rgb(247, 249, 250);
background: var(--surface-muted);
cursor: pointer;
@@ -140,11 +140,11 @@
border: 1px dashed var(--border-strong);
border-radius: 6px;
border-radius: 8px;
color: var(--text-secondary);
font-size: 11px;
font-size: var(--font-size-caption);
white-space: nowrap;
}
@@ -152,7 +152,7 @@
.ladder-gap {
min-height: 68px;
background: repeating-linear-gradient(135deg, rgb(255, 255, 255), rgb(255, 255, 255) 9px, rgb(250, 251, 252) 9px, rgb(250, 251, 252) 18px);
background: repeating-linear-gradient(135deg, var(--surface), var(--surface) 9px, var(--surface-subtle) 9px, var(--surface-subtle) 18px);
}
.ladder-gap-note {
@@ -353,6 +353,12 @@
box-shadow: none;
}
.ladder-page-head .section-title-group h2 {
font-size: var(--font-size-page-title);
font-weight: var(--font-weight-semibold);
}
.ladder-page-head {
margin-bottom: 12px;
}
@@ -384,13 +390,15 @@
}
.ladder-sort-segment button {
min-height: 28px;
padding: 4px 12px;
border-radius: 6px;
color: var(--r2-sub);
font-size: 12px;
font-size: var(--font-size-label);
}
.ladder-sort-segment button.active {
@@ -448,11 +456,11 @@
border-right: 1px solid var(--r2-line-soft);
background: linear-gradient(90deg, color-mix(in srgb, var(--tier-color) 8%, #fff), #fff);
background: linear-gradient(90deg, color-mix(in srgb, var(--tier-color) 8%, var(--surface)), var(--surface));
}
.market-ladder-tier.is-gap .market-ladder-label {
background: repeating-linear-gradient(45deg, rgb(250, 250, 250), rgb(250, 250, 250) 8px, rgb(243, 244, 246) 8px, rgb(243, 244, 246) 16px);
background: repeating-linear-gradient(45deg, var(--surface-subtle), var(--surface-subtle) 8px, var(--surface-muted) 8px, var(--surface-muted) 16px);
}
.market-ladder-level {
@@ -571,9 +579,9 @@
white-space: nowrap;
font-size: 13px;
font-size: var(--font-size-table);
font-weight: 800;
font-weight: var(--font-weight-semibold);
}
.market-ladder-stock-first .stock-code {
@@ -613,7 +621,7 @@
.market-ladder-tag.one-price {
background: var(--r2-up-soft);
color: rgb(194, 46, 46);
color: var(--r2-up);
font-weight: 700;
}
@@ -762,9 +770,9 @@
.market-ladder-insight-card > header h3 {
margin: 0px;
font-size: 13.5px;
font-size: var(--font-size-card-title);
font-weight: 700;
font-weight: var(--font-weight-semibold);
}
.market-ladder-insight-card > header span {
@@ -796,9 +804,9 @@
.market-ladder-apex strong {
color: var(--r2-up);
font-size: 26px;
font-size: var(--font-size-metric);
font-weight: 800;
font-weight: var(--font-weight-semibold);
}
.market-ladder-apex em {
@@ -900,7 +908,7 @@
}
.market-ladder-pyramid-row.is-gap > i {
background: repeating-linear-gradient(45deg, rgb(229, 231, 235), rgb(229, 231, 235) 4px, rgb(243, 244, 246) 4px, rgb(243, 244, 246) 8px);
background: repeating-linear-gradient(45deg, var(--border), var(--border) 4px, var(--surface-muted) 4px, var(--surface-muted) 8px);
}
.market-ladder-pyramid-row.is-gap > i b {
@@ -968,11 +976,11 @@
}
.market-ladder-rate-list > div > i b.is-low {
background: rgb(245, 158, 11);
background: var(--r2-amber);
}
.market-ladder-rate-list > div > i b.is-zero {
background: rgb(209, 213, 219);
background: var(--border-strong);
}
.market-ladder-rate-list > div > strong {
app/frontend/pages/ladder/page.js
+1 -1
View File
@@ -51,7 +51,7 @@ function renderLadderBoard(ladders) {
const stocks = expanded ? groupStocks : groupStocks.slice(0, limit);
const remaining = Math.max(0, groupStocks.length - stocks.length);
const label = group.label || (level === 1 ? "首板" : level === 5 && maxLevel < 5 ? "5板+" : `${level}板`);
const color = { 1: "#2563eb", 2: "#16a34a", 3: "#d97706", 4: "#e04536" }[level] || "#9ca3af";
const color = { 1: "#3370ff", 2: "#16a34a", 3: "#b45309", 4: "#e04536" }[level] || "#8f959e";
return `
<section class="market-ladder-tier ${number(group.count) ? "" : "is-gap"}" data-ladder-level-card="${level}">
<div class="market-ladder-label" style="--tier-color:${color}"><div class="market-ladder-level"><span class="market-ladder-dot"></span>${escapeHtml(label)}</div><div class="market-ladder-count">${number(group.count)} 只</div>${number(group.count) && level > 1 ? `<div class="market-ladder-rate">${escapeHtml(label)} · <b>${formatNumber(number(group.count) / Math.max(number(groupMap.get(level - 1)?.count), 1) * 100, 1)}%</b></div>` : ""}</div>
app/frontend/pages/popularity/foundation.css
Vendored
+46 -37
View File
@@ -22,11 +22,11 @@
}
.popularity-source-tag.dual {
border-color: rgb(230, 199, 115);
border-color: var(--warn);
background: var(--amber-soft);
color: rgb(118, 83, 20);
color: var(--warn);
}
.popularity-concepts {
@@ -44,21 +44,21 @@
}
#popularityView .data-table {
font-size: 12px;
font-size: var(--font-size-table);
}
#popularityView .data-table thead th {
height: 32px;
height: 36px;
padding: 6px 9px;
padding: 0 12px;
font-size: 11.5px;
font-size: var(--font-size-caption);
}
#popularityView .data-table tbody td {
height: 39px;
height: 40px;
padding: 5px 9px;
padding: 0 12px;
}
.redesigned-popularity-view {
@@ -93,6 +93,10 @@
margin: 0px;
color: var(--r2-ink);
font-size: var(--font-size-page-title);
font-weight: var(--font-weight-semibold);
}
.popularity-title-v2 > span {
@@ -140,7 +144,7 @@
align-items: center;
min-height: 34px;
min-height: 32px;
padding: 3px;
@@ -152,19 +156,19 @@
}
.popularity-source-tabs-v2 button {
min-height: 27px;
min-height: 26px;
padding: 0px 13px;
border: 0px;
border-radius: 5px;
border-radius: 6px;
background: transparent;
color: var(--r2-sub);
font-size: 11px;
font-size: var(--font-size-label);
cursor: pointer;
}
@@ -190,11 +194,15 @@
}
.popularity-refresh-v2 {
min-height: 34px;
min-height: 32px;
padding: 0px 11px;
height: 32px;
border-radius: 7px;
padding: 0px 12px;
border-radius: 8px;
font-size: var(--font-size-label);
}
.popularity-refresh-v2 .lucide {
@@ -244,15 +252,15 @@
width: 3px;
background: rgb(199, 216, 251);
background: var(--accent-soft);
}
.popularity-glance-v2 article:nth-child(2)::before {
background: rgb(183, 221, 207);
background: var(--down-soft);
}
.popularity-glance-v2 article.consensus::before {
background: rgb(230, 199, 115);
background: var(--warn);
}
.popularity-glance-v2 article > span {
@@ -372,7 +380,7 @@
width: 230px;
height: 33px;
height: 32px;
flex: 0 0 auto;
@@ -380,9 +388,9 @@
padding: 0px 10px;
border: 1px solid rgb(216, 221, 229);
border: 1px solid var(--border-strong);
border-radius: 7px;
border-radius: 8px;
color: var(--r2-faint);
@@ -390,9 +398,9 @@
}
.popularity-search-v2:focus-within {
border-color: rgb(150, 181, 242);
border-color: var(--accent);
box-shadow: rgba(37, 99, 235, 0.09) 0px 0px 0px 3px;
box-shadow: 0 0 0 2px var(--focus-ring);
}
.popularity-search-v2 .lucide {
@@ -446,15 +454,15 @@
z-index: 2;
height: 35px;
height: 36px;
padding: 7px 10px;
padding: 0 12px;
border-bottom-color: var(--r2-line);
color: var(--r2-sub);
font-size: 10.5px;
font-size: var(--font-size-caption);
}
.popularity-table-v2 thead th:nth-child(1) {
@@ -477,11 +485,11 @@
}
.popularity-table-v2 tbody td {
height: 43px;
height: 40px;
padding: 7px 10px;
padding: 0 12px;
font-size: 11.5px;
font-size: var(--font-size-table);
}
.popularity-table-v2 tbody tr {
@@ -541,9 +549,9 @@
color: var(--r2-ink);
font-size: 12px;
font-size: var(--font-size-table);
font-weight: 700;
font-weight: var(--font-weight-semibold);
text-overflow: ellipsis;
@@ -559,7 +567,7 @@
}
.popularity-list-rank-v2 {
color: rgb(64, 85, 115);
color: var(--text-2);
}
.popularity-movement-v2 {
@@ -658,11 +666,9 @@
}
.popularity-table-v2 tbody td {
height: 39px;
height: 40px;
padding-top: 5px;
padding-bottom: 5px;
padding: 0 12px;
}
}
@@ -857,8 +863,11 @@
width: auto;
}
#popularityView .popularity-table-v2 th:first-child {
#popularityView .popularity-table-v2 th:first-child,
#popularityView .popularity-table-v2 td:first-child {
width: var(--col-rank);
text-align: left;
}
#popularityView .popularity-table-v2 th:nth-child(2) {
app/frontend/pages/popularity/page.js
+2 -2
View File
@@ -50,7 +50,7 @@ function renderPopularityTable() {
setText("popularityTableTitle", `${sourceName}榜`);
setText("popularityTableNote", combined ? "按双榜排名综合排序 · 已隐藏重复的榜单状态" : "按榜单名次排序 · 状态显示是否同时进入另一榜");
const headers = [
["排名", "number num"], ["股票", ""], ["最新价（元）", "number num"], ["涨跌幅（%）", "number num"],
["排名", "row-number"], ["股票", ""], ["最新价（元）", "number num"], ["涨跌幅（%）", "number num"],
...(source !== "dc" ? [["同花顺", "number num"]] : []),
...(source !== "ths" ? [["东方财富", "number num"]] : []),
["排名变化", "number num"], ["热门概念", ""], ...(!combined ? [["榜单状态", ""]] : []),
@@ -63,7 +63,7 @@ function renderPopularityTable() {
const move = row.rank_change;
const movement = move === null || move === undefined ? "新" : number(move) > 0 ? `↑${number(move)}` : number(move) < 0 ? `↓${Math.abs(number(move))}` : "持平";
return `<tr data-code="${escapeHtml(row.code)}">
<td class="number num popularity-rank-v2"><b>${index + 1}</b>${index < 3 ? '<span>热</span>' : ""}</td>
<td class="row-number popularity-rank-v2"><b>${index + 1}</b>${index < 3 ? '<span>热</span>' : ""}</td>
<td><div class="popularity-stock-v2"><strong class="stock-name sname">${escapeHtml(row.name)}</strong><span class="stock-code scode">${escapeHtml(row.code)}</span></div></td>
<td class="number num">${row.price == null ? "" : formatNumber(row.price, 2)}</td>
<td class="number num ${row.change == null ? "" : changeClass(row.change)}">${row.change == null ? "" : signed(row.change)}</td>
app/frontend/pages/rotation/foundation.css
Vendored
+60 -49
View File
@@ -25,7 +25,7 @@
}
.rotation-day.selected-day {
background: rgb(240, 246, 253);
background: var(--selected);
}
.rotation-sector-chip.selected {
@@ -81,11 +81,11 @@
}
.rotation-day:nth-child(2n+1) {
background: rgb(246, 248, 250);
background: var(--surface-subtle);
}
.rotation-day-sector {
border-color: rgb(231, 235, 239);
border-color: var(--border);
border-radius: 4px;
@@ -107,7 +107,7 @@
}
:where(#rotationView) .rotation-swatch {
background: rgba(53, 106, 230, 0.12);
background: var(--accent-soft);
}
:where(#rotationView) .rotation-tracker-copy {
@@ -157,9 +157,9 @@
cursor: pointer;
border-bottom: 1px dashed rgba(135, 149, 173, 0.22);
border-bottom: 1px dashed var(--border);
background: rgba(53, 106, 230, calc(.04 + var(--rotation-heat) * .46));
background: color-mix(in srgb, var(--accent) calc(4% + var(--rotation-heat) * 46%), transparent);
}
.redesigned-rotation-view {
@@ -185,9 +185,9 @@
color: var(--r2-ink);
font-size: 17px;
font-size: var(--font-size-page-title);
font-weight: 800;
font-weight: var(--font-weight-semibold);
letter-spacing: 0px;
}
@@ -241,7 +241,7 @@
color: var(--r2-sub);
font-size: 12px;
font-size: var(--font-size-label);
line-height: 1;
}
@@ -260,13 +260,15 @@
.rotation-order-control button:focus-visible,
.rotation-sector-chip:focus-visible,
.rotation-track-cancel:focus-visible {
outline: rgba(37, 99, 235, 0.28) solid 2px;
outline: 2px solid var(--accent);
outline-offset: 2px;
}
.rotation-export-button {
min-height: 30px;
min-height: 32px;
height: 32px;
display: inline-flex;
@@ -274,17 +276,17 @@
justify-content: center;
padding: 5px 12px;
padding: 0 12px;
border: 1px solid var(--r2-line);
border: 1px solid var(--border-strong);
border-radius: 7px;
border-radius: 8px;
background: var(--surface);
color: rgb(55, 65, 81);
color: var(--text-primary);
font-size: 12px;
font-size: var(--font-size-label);
font-weight: 500;
}
@@ -433,17 +435,17 @@
}
#rotationView .rotation-swatch.strong {
background: rgb(112, 155, 245);
background: var(--accent);
}
#rotationView .rotation-swatch.warm {
background: rgb(203, 220, 255);
background: var(--accent-soft);
}
#rotationView .rotation-swatch.mild {
background: rgb(240, 244, 250);
background: var(--surface-muted);
border: 1px solid rgb(223, 230, 240);
border: 1px solid var(--border);
}
#rotationView .rotation-tracker {
@@ -487,7 +489,7 @@
}
#rotationView .rotation-tracker-copy span {
color: rgb(59, 98, 196);
color: var(--accent-hover);
font-size: 12px;
@@ -535,7 +537,7 @@
border-radius: 2px 2px 0px 0px;
background: rgb(147, 180, 245);
background: var(--accent);
}
#rotationView .rotation-tracker-spark small {
@@ -543,7 +545,7 @@
top: -1px;
color: rgb(59, 98, 196);
color: var(--accent-hover);
font-size: 9px;
}
@@ -555,7 +557,7 @@
border-style: dashed dashed none;
border-color: rgb(185, 200, 232) rgb(185, 200, 232) currentcolor;
border-color: var(--action-line) var(--action-line) currentcolor;
border-image: none;
@@ -567,7 +569,9 @@
}
.rotation-track-cancel {
min-height: 30px;
min-height: 32px;
height: 32px;
display: inline-flex;
@@ -575,21 +579,21 @@
justify-content: center;
border: 1px solid var(--r2-line);
border: 1px solid var(--border-strong);
border-radius: 7px;
border-radius: 8px;
background: var(--surface);
color: rgb(55, 65, 81);
color: var(--text-primary);
font-size: 12px;
font-size: var(--font-size-label);
font-weight: 500;
margin-left: auto;
padding: 4px 9px;
padding: 0 12px;
}
#rotationView .rotation-history {
@@ -697,7 +701,7 @@
padding: 5px;
background: rgb(251, 252, 254);
background: var(--surface-subtle);
}
#rotationView .rotation-sector-chip {
@@ -817,7 +821,7 @@
border-color: var(--r2-blue);
box-shadow: inset 3px 0 0 var(--r2-blue), 0 0 0 1px rgba(37, 99, 235, .12);
box-shadow: inset 3px 0 0 var(--r2-blue), 0 0 0 1px var(--accent-soft);
}
.rotation-cell-tooltip {
@@ -864,9 +868,9 @@
}
#rotationView .rotation-table thead th {
height: 37px;
height: 36px;
padding: 8px 12px;
padding: 0 12px;
border-bottom: 1px solid var(--r2-line);
@@ -874,7 +878,7 @@
color: var(--r2-sub);
font-size: 12px;
font-size: var(--font-size-caption);
font-weight: 600;
@@ -887,8 +891,13 @@
text-align: right;
}
#rotationView .rotation-table thead th:first-child,
#rotationView .rotation-table tbody td:first-child {
text-align: left;
}
#rotationView .rotation-table thead th[data-auto-sort] {
color: rgb(75, 85, 99);
color: var(--text-2);
cursor: pointer;
@@ -918,14 +927,16 @@
}
#rotationView .rotation-table tbody td {
height: 42px;
height: 40px;
padding: 8px 12px;
padding: 0 12px;
border-bottom: 1px solid var(--r2-line-soft);
color: var(--r2-ink);
font-size: var(--font-size-table);
white-space: nowrap;
}
@@ -934,7 +945,7 @@
}
#rotationView .rotation-table tbody tr:hover td {
background: rgb(248, 250, 255);
background: var(--table-hover);
}
#rotationView .rotation-table .stock-name {
@@ -954,9 +965,9 @@
}
#rotationView .trend-cool {
background: rgb(232, 244, 253);
background: var(--accent-soft);
color: rgb(37, 99, 235);
color: var(--accent);
}
#rotationView .trend-new {
@@ -1040,25 +1051,25 @@
}
#rotationView .rotation-sector-chip.heat-mild {
border-color: rgb(229, 234, 241);
border-color: var(--border);
background: rgb(246, 248, 251);
background: var(--surface-muted);
box-shadow: none;
}
#rotationView .rotation-sector-chip.heat-strong {
border-color: rgba(37, 99, 235, 0.24);
border-color: var(--action-line);
background: rgb(197, 215, 251);
background: var(--accent-soft);
box-shadow: none;
}
#rotationView .rotation-sector-chip.heat-warm {
border-color: rgba(37, 99, 235, 0.12);
border-color: var(--action-line);
background: rgb(231, 239, 255);
background: color-mix(in srgb, var(--accent) 12%, var(--surface));
box-shadow: none;
}
@@ -1066,7 +1077,7 @@
#rotationView .rotation-sector-chip:hover {
z-index: 6;
border-color: rgba(37, 99, 235, 0.34);
border-color: var(--accent);
filter: saturate(1.06);
@@ -1080,7 +1091,7 @@
border-collapse: collapse;
font-size: 12.5px;
font-size: var(--font-size-table);
table-layout: auto;
app/frontend/pages/rotation/page.html
+1 -1
View File
@@ -41,7 +41,7 @@
<div class="rotation-table-frame tbl-wrap">
<table id="rotationTable" class="data-table tbl rotation-table">
<thead><tr>
<th class="number num">序号</th><th>代码</th><th>股票</th>
<th class="row-number">序号</th><th>代码</th><th>股票</th>
<th class="number num" data-auto-sort="true" title="涨跌幅：点击排序">涨跌幅（%）</th>
<th class="number num">开盘价（元）</th><th class="number num">收盘价（元）</th>
<th class="number num" data-auto-sort="true" title="成交额：点击排序">成交额（亿）</th><th>行情状态</th>
app/frontend/pages/rotation/page.js
+1 -1
View File
@@ -161,7 +161,7 @@ function renderRotationMembers() {
setText("rotationDetailTitle", `${payload.meta?.sector_name || state.rotationSelectedSector}成分股`);
setText("rotationDetailMeta", `${displayCompactDate(payload.meta?.trade_date)} · ${number(payload.meta?.quoted_count)} / ${number(payload.meta?.member_count)} 只`);
body.innerHTML = rows.map((row, index) => `
<tr data-code="${escapeHtml(row.code)}"><td class="number num muted">${index + 1}</td><td class="stock-code">${escapeHtml(row.code)}</td><td class="stock-name">${escapeHtml(row.name)}</td>
<tr data-code="${escapeHtml(row.code)}"><td class="row-number muted">${index + 1}</td><td class="stock-code">${escapeHtml(row.code)}</td><td class="stock-name">${escapeHtml(row.name)}</td>
<td class="number num ${row.quoted ? changeClass(row.change) : "muted"}" data-sort-value="${row.quoted ? number(row.change) : -999}">${row.quoted ? signed(row.change) : ""}</td>
<td class="number num">${row.quoted ? formatNumber(row.open, 2) : ""}</td><td class="number num">${row.quoted ? formatNumber(row.close, 2) : ""}</td>
<td class="number num" data-sort-value="${number(row.amount_billion)}">${row.quoted ? formatNumber(row.amount_billion, 2) : ""}</td><td>${row.quoted ? "正常交易" : "当日无行情"}</td></tr>
app/frontend/pages/themes/foundation.css
Vendored
+35 -24
View File
@@ -184,15 +184,15 @@
padding: 9px 13px;
border-bottom-color: rgb(231, 235, 239);
border-bottom-color: var(--border);
}
.theme-directory-item:hover {
background: rgb(241, 246, 251);
background: var(--hover);
}
.theme-directory-item.active {
background: rgb(234, 242, 251);
background: var(--selected);
box-shadow: inset 3px 0 var(--action);
}
@@ -294,6 +294,10 @@
margin: 0px;
color: var(--r2-ink);
font-size: var(--font-size-page-title);
font-weight: var(--font-weight-semibold);
}
.theme-title-v2 > div > span {
@@ -331,7 +335,7 @@
.theme-search-v2 {
width: 250px;
height: 34px;
height: 32px;
display: flex;
@@ -341,9 +345,9 @@
padding: 0px 10px;
border: 1px solid var(--control-border);
border: 1px solid var(--border-strong);
border-radius: 7px;
border-radius: 8px;
background: var(--surface);
@@ -389,11 +393,15 @@
}
.theme-refresh-v2 {
min-height: 34px;
min-height: 32px;
height: 32px;
padding: 0px 12px;
border-radius: 7px;
border-radius: 8px;
font-size: var(--font-size-label);
}
.theme-refresh-v2 .lucide {
@@ -441,17 +449,17 @@
}
.theme-summary-v2 span {
color: var(--r2-sub);
color: var(--text-3);
font-size: 11px;
font-size: var(--font-size-caption);
}
.theme-summary-v2 strong {
color: var(--r2-ink);
font-size: 19px;
font-size: var(--font-size-metric);
font-weight: var(--font-weight-bold);
font-weight: var(--font-weight-semibold);
font-variant-numeric: tabular-nums;
}
@@ -527,9 +535,9 @@
color: var(--r2-ink);
font-size: 14px;
font-size: var(--font-size-card-title);
font-weight: 700;
font-weight: var(--font-weight-semibold);
}
.theme-card-head-v2 span {
@@ -1028,9 +1036,9 @@
z-index: 2;
height: 34px;
height: 36px;
padding: 6px 11px;
padding: 0 12px;
border-bottom-color: var(--r2-line);
@@ -1038,15 +1046,20 @@
color: var(--r2-sub);
font-size: 10.5px;
font-size: var(--font-size-caption);
}
.theme-members-table-v2 tbody td {
height: 39px;
height: 40px;
padding: 7px 11px;
padding: 0 12px;
font-size: 11.5px;
font-size: var(--font-size-table);
}
.theme-members-table-v2 thead th:first-child,
.theme-members-table-v2 tbody td:first-child {
text-align: left;
}
.theme-members-table-v2 tbody tr {
@@ -1184,11 +1197,9 @@
}
.theme-members-table-v2 tbody td {
height: 35px;
height: 40px;
padding-top: 5px;
padding-bottom: 5px;
padding: 0 12px;
}
}
app/frontend/pages/themes/page.html
+1 -1
View File
@@ -46,7 +46,7 @@
<strong id="themeMemberCount">0 只</strong>
</header>
<div class="theme-members-frame-v2 tbl-wrap">
<table class="data-table tbl theme-members-table-v2"><thead><tr><th class="num">序号</th><th>股票</th><th class="number num sortable">涨跌幅（%）<span class="arr">↕</span></th><th class="number num sortable">收盘价（元）<span class="arr">↕</span></th><th class="number num sortable">成交额（亿）<span class="arr">↕</span></th></tr></thead><tbody id="themeMemberTableBody"></tbody></table>
<table class="data-table tbl theme-members-table-v2"><thead><tr><th class="row-number">序号</th><th>股票</th><th class="number num sortable">涨跌幅（%）<span class="arr">↕</span></th><th class="number num sortable">收盘价（元）<span class="arr">↕</span></th><th class="number num sortable">成交额（亿）<span class="arr">↕</span></th></tr></thead><tbody id="themeMemberTableBody"></tbody></table>
</div>
</section>
</div>
app/frontend/pages/themes/page.js
+1 -1
View File
@@ -97,7 +97,7 @@ function renderThemeDetail() {
setText("themeMemberCount", `有行情 ${number(summary.quoted_count)} / ${number(summary.member_count)}`);
const body = document.querySelector("#themeMemberTableBody");
body.innerHTML = (payload.members || []).map((row, index) => `
<tr data-code="${escapeHtml(row.code)}"><td class="row-number num muted">${index + 1}</td>
<tr data-code="${escapeHtml(row.code)}"><td class="row-number muted">${index + 1}</td>
<td><span class="stock-cell"><strong class="stock-name sname">${escapeHtml(row.name)}</strong><small class="stock-code scode">${escapeHtml(row.code)}</small></span></td>
<td class="number num ${changeClass(row.change)}">${row.has_quote ? signed(row.change) : ""}</td>
<td class="number num">${row.has_quote ? formatNumber(row.price, 2) : ""}</td><td class="number num">${row.has_quote ? formatNumber(row.amount_billion, 2) : ""}</td></tr>`).join("");