Improve hub and instance navigation contrast for light and dark themes.
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -1,4 +1,21 @@
|
||||
/* 实例页手机端:与中控一致,桌面专属区块隐藏;下载仅电脑端 */
|
||||
:root,
|
||||
html[data-theme="dark"] {
|
||||
--inst-label: #8892b0;
|
||||
--inst-muted: #9aa3bf;
|
||||
--inst-text: #e8ecff;
|
||||
--inst-nav-idle: #8fc8ff;
|
||||
--inst-nav-active-fg: #dbe4ff;
|
||||
}
|
||||
|
||||
html[data-theme="light"] {
|
||||
--inst-label: #4a6078;
|
||||
--inst-muted: #5a6f85;
|
||||
--inst-text: #142232;
|
||||
--inst-nav-idle: #006e9a;
|
||||
--inst-nav-active-fg: #004d6e;
|
||||
}
|
||||
|
||||
@media (max-width: 720px) {
|
||||
.instance-desktop-only {
|
||||
display: none !important;
|
||||
@@ -362,13 +379,23 @@ html[data-theme="light"] .exchange-tag {
|
||||
|
||||
html[data-theme="light"] .top-nav a {
|
||||
background: #fff !important;
|
||||
color: #006e9a !important;
|
||||
color: var(--inst-nav-idle) !important;
|
||||
border-color: rgba(0, 95, 140, 0.22) !important;
|
||||
}
|
||||
|
||||
html[data-theme="light"] .top-nav a.active {
|
||||
html[data-theme="light"] .top-nav a:hover,
|
||||
html[data-theme="light"] .embed-top-nav a:hover,
|
||||
html[data-theme="light"] .strategy-subnav a:hover {
|
||||
background: rgba(0, 110, 154, 0.1) !important;
|
||||
color: var(--inst-nav-active-fg) !important;
|
||||
}
|
||||
|
||||
html[data-theme="light"] .top-nav a.active,
|
||||
html[data-theme="light"] .embed-top-nav a.active {
|
||||
background: rgba(0, 110, 154, 0.12) !important;
|
||||
color: #142232 !important;
|
||||
color: var(--inst-nav-active-fg) !important;
|
||||
border: 1px solid rgba(0, 95, 140, 0.28) !important;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
html[data-theme="light"] .stat-item,
|
||||
@@ -581,7 +608,7 @@ html[data-theme="light"] .theme-toggle-btn.is-active {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
color: #9aa;
|
||||
color: var(--inst-label);
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@@ -590,13 +617,13 @@ html[data-theme="light"] .theme-toggle-btn.is-active {
|
||||
}
|
||||
|
||||
.list-window-label {
|
||||
color: #cfd3ef;
|
||||
color: var(--inst-text);
|
||||
font-size: 0.82rem;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.list-window-hint {
|
||||
color: #8892b0;
|
||||
color: var(--inst-muted);
|
||||
font-size: 0.72rem;
|
||||
white-space: nowrap;
|
||||
}
|
||||
@@ -650,7 +677,7 @@ html[data-theme="light"] .theme-toggle-btn.is-active {
|
||||
|
||||
.stat-strip-item .label {
|
||||
font-size: 0.72rem;
|
||||
color: #8892b0;
|
||||
color: var(--inst-label);
|
||||
margin-bottom: 6px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
@@ -658,7 +685,7 @@ html[data-theme="light"] .theme-toggle-btn.is-active {
|
||||
.stat-strip-item .value {
|
||||
font-size: 0.88rem;
|
||||
font-weight: 600;
|
||||
color: #e8ecff;
|
||||
color: var(--inst-text);
|
||||
line-height: 1.3;
|
||||
white-space: nowrap;
|
||||
}
|
||||
@@ -726,7 +753,16 @@ html[data-theme="light"] .theme-toggle-btn.is-active {
|
||||
}
|
||||
|
||||
html[data-theme="light"] .stat-strip-item .value {
|
||||
color: #142232;
|
||||
color: var(--inst-text);
|
||||
}
|
||||
|
||||
html[data-theme="light"] .stat-strip-item .label,
|
||||
html[data-theme="light"] .instance-header-toolbar-filter label {
|
||||
color: var(--inst-label) !important;
|
||||
}
|
||||
|
||||
html[data-theme="light"] .list-window-hint {
|
||||
color: var(--inst-muted) !important;
|
||||
}
|
||||
|
||||
html[data-theme="light"] .instance-header-stats {
|
||||
@@ -1067,6 +1103,19 @@ html[data-theme="light"] .strategy-subnav {
|
||||
border-bottom-color: #d0dae4 !important;
|
||||
}
|
||||
|
||||
html[data-theme="light"] .strategy-subnav a {
|
||||
background: #fff !important;
|
||||
color: var(--inst-nav-idle) !important;
|
||||
border-color: rgba(0, 95, 140, 0.22) !important;
|
||||
}
|
||||
|
||||
html[data-theme="light"] .strategy-subnav a.active {
|
||||
background: rgba(0, 110, 154, 0.12) !important;
|
||||
color: var(--inst-nav-active-fg) !important;
|
||||
border: 1px solid rgba(0, 95, 140, 0.28) !important;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* ── 策略交易 / 策略记录(strategy_templates 内联)── */
|
||||
html[data-theme="dark"] .strategy-records-page .sr-summary,
|
||||
html[data-theme="dark"] .strategy-records-page .sr-detail {
|
||||
|
||||
@@ -24,16 +24,27 @@ html[data-theme="light"] .header h1 {
|
||||
}
|
||||
|
||||
html[data-theme="light"] .top-nav a,
|
||||
html[data-theme="light"] .embed-top-nav a,
|
||||
html[data-theme="light"] .strategy-subnav a {
|
||||
background: #fff !important;
|
||||
color: #006e9a !important;
|
||||
border-color: rgba(0, 95, 140, 0.22) !important;
|
||||
}
|
||||
|
||||
html[data-theme="light"] .top-nav a:hover,
|
||||
html[data-theme="light"] .embed-top-nav a:hover,
|
||||
html[data-theme="light"] .strategy-subnav a:hover {
|
||||
background: rgba(0, 110, 154, 0.1) !important;
|
||||
color: #004d6e !important;
|
||||
}
|
||||
|
||||
html[data-theme="light"] .top-nav a.active,
|
||||
html[data-theme="light"] .embed-top-nav a.active,
|
||||
html[data-theme="light"] .strategy-subnav a.active {
|
||||
background: rgba(0, 110, 154, 0.12) !important;
|
||||
color: #142232 !important;
|
||||
color: #004d6e !important;
|
||||
border: 1px solid rgba(0, 95, 140, 0.28) !important;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
html[data-theme="light"] .card,
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
<link rel="stylesheet" href="/static/instance_theme_early.css?v=4">
|
||||
<link rel="stylesheet" href="/static/account_risk_badge.css?v=4">
|
||||
<link rel="stylesheet" href="/static/instance_page.css?v=4">
|
||||
<link rel="stylesheet" href="/static/instance_theme.css?v=76">
|
||||
<link rel="stylesheet" href="/static/instance_theme.css?v=77">
|
||||
<script src="/static/account_risk_badge.js?v=4"></script>
|
||||
<meta name="theme-color" content="#0b0d14">
|
||||
<title>{{ exchange_display }} · 加密货币 | 交易监控复盘系统</title>
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
<link rel="manifest" href="/static/icons/manifest.webmanifest">
|
||||
<title>{{ exchange_display }} · 加密货币 | 交易监控复盘系统</title>
|
||||
<link rel="stylesheet" href="/static/instance_page.css?v=1">
|
||||
<link rel="stylesheet" href="/static/instance_theme.css?v=76">
|
||||
<link rel="stylesheet" href="/static/instance_theme.css?v=77">
|
||||
|
||||
</head>
|
||||
<body
|
||||
|
||||
@@ -68,6 +68,9 @@ html[data-theme="dark"] {
|
||||
--archive-viz-mid-line: rgba(255, 255, 255, 0.2);
|
||||
--archive-profit: #4cd97f;
|
||||
--archive-loss: #ff6b6b;
|
||||
--nav-link-idle: var(--muted);
|
||||
--nav-link-hover-bg: var(--panel-hover);
|
||||
--nav-link-active-fg: var(--accent);
|
||||
color-scheme: dark;
|
||||
}
|
||||
|
||||
@@ -135,6 +138,9 @@ html[data-theme="light"] {
|
||||
--archive-viz-mid-line: rgba(20, 34, 50, 0.22);
|
||||
--archive-profit: var(--green);
|
||||
--archive-loss: var(--red);
|
||||
--nav-link-idle: #3a5068;
|
||||
--nav-link-hover-bg: rgba(0, 110, 154, 0.08);
|
||||
--nav-link-active-fg: #004d6e;
|
||||
color-scheme: light;
|
||||
}
|
||||
|
||||
@@ -343,11 +349,12 @@ a:hover {
|
||||
padding: 8px 16px;
|
||||
border-radius: 7px;
|
||||
text-decoration: none;
|
||||
color: var(--muted);
|
||||
color: var(--nav-link-idle);
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
letter-spacing: 0.04em;
|
||||
transition: background 0.15s, color 0.15s, box-shadow 0.15s;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.top-nav a.nav-hidden {
|
||||
@@ -356,15 +363,16 @@ a:hover {
|
||||
|
||||
.top-nav a:hover {
|
||||
color: var(--text);
|
||||
background: var(--panel-hover);
|
||||
background: var(--nav-link-hover-bg);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.top-nav a.active {
|
||||
background: linear-gradient(135deg, rgba(0, 212, 255, 0.2), rgba(123, 97, 255, 0.15));
|
||||
color: var(--accent);
|
||||
border: 1px solid var(--border);
|
||||
color: var(--nav-link-active-fg);
|
||||
border-color: var(--border);
|
||||
box-shadow: var(--glow);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
button.ghost {
|
||||
@@ -5122,11 +5130,47 @@ html[data-theme="light"] .side-short {
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
html[data-theme="light"] .top-nav {
|
||||
background: rgba(255, 255, 255, 0.96);
|
||||
border-color: rgba(0, 75, 115, 0.18);
|
||||
box-shadow: 0 1px 4px rgba(30, 60, 100, 0.08);
|
||||
}
|
||||
|
||||
html[data-theme="light"] .top-nav a.active {
|
||||
background: linear-gradient(135deg, rgba(0, 110, 154, 0.14), rgba(91, 79, 199, 0.08));
|
||||
color: var(--nav-link-active-fg);
|
||||
border-color: rgba(0, 95, 140, 0.28);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
html[data-theme="light"] .theme-toggle {
|
||||
background: rgba(255, 255, 255, 0.96);
|
||||
border-color: rgba(0, 75, 115, 0.18);
|
||||
}
|
||||
|
||||
html[data-theme="light"] .theme-toggle-btn.is-active {
|
||||
color: var(--nav-link-active-fg);
|
||||
background: rgba(0, 110, 154, 0.12);
|
||||
}
|
||||
|
||||
html[data-theme="light"] .header-right #btn-logout {
|
||||
color: var(--nav-link-idle);
|
||||
border-color: rgba(0, 75, 115, 0.18);
|
||||
}
|
||||
|
||||
html[data-theme="light"] .instance-frame-toolbar {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
html[data-theme="light"] .instance-frame-toolbar .ghost {
|
||||
color: var(--nav-link-idle);
|
||||
border-color: rgba(0, 75, 115, 0.18);
|
||||
}
|
||||
|
||||
html[data-theme="light"] .instance-frame-title {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
html[data-theme="light"] .mkt-exchange-tag {
|
||||
background: rgba(10, 143, 92, 0.1);
|
||||
border-color: rgba(10, 143, 92, 0.32);
|
||||
|
||||
@@ -15,7 +15,7 @@
|
||||
<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'" />
|
||||
<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=20260708-hub-ai-env" />
|
||||
<link rel="stylesheet" href="/assets/app.css?v=20260710-nav-theme" />
|
||||
<link rel="stylesheet" href="/assets/trade_stats_calendar.css?v=3" />
|
||||
<link rel="stylesheet" href="/assets/account_risk_badge.css?v=4" />
|
||||
<script src="/assets/account_risk_badge.js?v=4"></script>
|
||||
|
||||
Reference in New Issue
Block a user