freedak/stock
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: UI/UX全面优化 — CSS变量体系/a11y无障碍/Admin角色化/骨架屏/打印样式

Browse Source
This commit is contained in:
selfrelease
2026-07-18 07:57:23 +08:00
parent 2b5a32ca1e
commit 4b42eb80fd
15 changed files with 1519 additions and 442 deletions
Download Patch File Download Diff File Expand all files Collapse all files
stock-html/static/css/pages.css
+64 -26
View File
@@ -27,13 +27,13 @@
font-weight: 600; cursor: pointer; white-space: nowrap;
}
.tech-btn.batch { background: var(--warning); color: #333; }
.tech-btn.fullscan { background: #6c5ce7; color: #fff; }
.tech-btn.fullscan { background: var(--primary); color: #fff; }
.tech-btn.strategy { background: linear-gradient(135deg, #ff6b6b, #ffd93d); color: #1a1a2e; font-weight: 700; }
.tech-btn.rescan {
background: transparent; border: 1px solid rgba(255,255,255,0.15);
color: var(--text-muted); font-size: 11px;
}
.tech-btn.rescan:hover { border-color: #ff6b6b; color: #ff6b6b; }
.tech-btn.rescan:hover { border-color: var(--danger); color: var(--danger); }
.tech-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.tech-legend {
@@ -41,13 +41,13 @@
}
.legend-item { display: flex; align-items: center; gap: 3px; }
.dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.dot.s85 { background: #e74c3c; }
.dot.s80 { background: #e67e22; }
.dot.s75 { background: #f39c12; }
.dot.s70 { background: #27ae60; }
.dot.s65 { background: #2980b9; }
.dot.s60 { background: #8e44ad; }
.dot.s55 { background: #95a5a6; }
.dot.s85 { background: var(--sig-85); }
.dot.s80 { background: var(--sig-80); }
.dot.s75 { background: var(--sig-75); }
.dot.s70 { background: var(--sig-70); }
.dot.s65 { background: var(--sig-65); }
.dot.s60 { background: var(--sig-60); }
.dot.s55 { background: var(--sig-55); }
.tech-result-card {
background: var(--bg-glass); border-radius: 16px;
@@ -137,13 +137,13 @@
font-size: 11px; padding: 2px 8px; border-radius: 8px;
font-weight: 600; color: white;
}
.batch-signal-tag.strength-85 { background: #e74c3c; }
.batch-signal-tag.strength-80 { background: #e67e22; }
.batch-signal-tag.strength-75 { background: #f39c12; }
.batch-signal-tag.strength-70 { background: #27ae60; }
.batch-signal-tag.strength-65 { background: #2980b9; }
.batch-signal-tag.strength-60 { background: #8e44ad; }
.batch-signal-tag.strength-55 { background: #95a5a6; }
.batch-signal-tag.strength-85 { background: var(--sig-85); }
.batch-signal-tag.strength-80 { background: var(--sig-80); }
.batch-signal-tag.strength-75 { background: var(--sig-75); }
.batch-signal-tag.strength-70 { background: var(--sig-70); }
.batch-signal-tag.strength-65 { background: var(--sig-65); }
.batch-signal-tag.strength-60 { background: var(--sig-60); }
.batch-signal-tag.strength-55 { background: var(--sig-55); }
/* ========== 模拟交易页面样式 ========== */
@@ -700,16 +700,16 @@
color: #fff;
background: #555;
}
.rank-1 .rank-badge { background: linear-gradient(135deg, #ff6b6b, #ffd93d); }
.rank-2 .rank-badge { background: linear-gradient(135deg, #00ce9e, #00b4d8); }
.rank-1 .rank-badge { background: linear-gradient(135deg, var(--danger), var(--warning)); }
.rank-2 .rank-badge { background: linear-gradient(135deg, var(--success), #00b4d8); }
.rank-3 .rank-badge { background: linear-gradient(135deg, #748ffc, #9775fa); }
.rank-name { font-weight: 600; color: var(--text-primary); }
.rank-1 .rank-name { color: #ffd93d; }
.rank-2 .rank-name { color: #00ce9e; }
.rank-1 .rank-name { color: var(--warning); }
.rank-2 .rank-name { color: var(--success); }
.rank-3 .rank-name { color: #748ffc; }
.rank-rate {
font-weight: 700;
color: #00ce9e;
color: var(--success);
text-align: right;
}
.rank-desc { color: var(--text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@@ -1588,8 +1588,8 @@
.deep-stock-code { font-size: 12px; color: rgba(255,255,255,0.5); margin-top: 2px; }
.deep-price { font-size: 22px; font-weight: 700; color: #fff; text-align: center; }
.deep-change { font-size: 14px; text-align: center; margin-top: 2px; }
.deep-change.up { color: #f44336; }
.deep-change.down { color: #4caf50; }
.deep-change.up { color: var(--up); }
.deep-change.down { color: var(--down); }
.deep-score-circle {
width: 50px; height: 50px; border-radius: 50%;
@@ -1598,11 +1598,49 @@
font-weight: 700;
}
.score-num { font-size: 20px; color: #fff; }
.deep-score-circle.score-high { background: linear-gradient(135deg, #f44336, #ff5722); }
.deep-score-circle.score-mid { background: linear-gradient(135deg, #ff9800, #ffc107); }
.deep-score-circle.score-low { background: linear-gradient(135deg, #607d8b, #78909c); }
.deep-score-circle.score-high { background: linear-gradient(135deg, var(--danger), #ff5722); }
.deep-score-circle.score-mid { background: linear-gradient(135deg, var(--warning), #ffc107); }
.deep-score-circle.score-low { background: linear-gradient(135deg, var(--sig-55), #78909c); }
.deep-verdict { text-align: center; font-size: 12px; color: rgba(255,255,255,0.6); margin-top: 4px; }
/* 三项得分明细 */
.deep-score-breakdown {
display: flex;
gap: 8px;
padding: 10px 14px;
background: rgba(255,255,255,0.04);
border-radius: 10px;
}
.score-breakdown-item {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
gap: 2px;
}
.score-breakdown-item .breakdown-label {
font-size: 11px;
color: var(--text-muted);
font-weight: 500;
}
.score-breakdown-item .breakdown-value {
font-size: 18px;
font-weight: 700;
color: var(--text-primary);
font-variant-numeric: tabular-nums;
}
.score-breakdown-item .breakdown-value.pos { color: var(--danger); }
.score-breakdown-item .breakdown-value.neg { color: var(--success); }
.score-breakdown-item.highlight {
background: rgba(108,92,231,0.12);
border-radius: 8px;
padding: 4px 0;
}
.score-breakdown-item.highlight .breakdown-value {
color: var(--primary);
font-size: 20px;
}
.deep-section {
background: var(--card-bg, #1e1e2e);
border-radius: 12px;