fix(hub): refine AI summary heading style for light and dark themes

Replace red text with white stroke by theme-aware accent bar and soft background tint.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-06-07 09:12:29 +08:00
parent f8220762c0
commit b828026c23
2 changed files with 34 additions and 54 deletions
+33 -53
View File
@@ -48,6 +48,10 @@ html[data-theme="dark"] {
--primary-btn-border: var(--accent); --primary-btn-border: var(--accent);
--status-done: #4cd97f; --status-done: #4cd97f;
--status-pending: #9aa3c4; --status-pending: #9aa3c4;
--ai-sum-heading: #ffc8d4;
--ai-sum-heading-bg: rgba(255, 77, 109, 0.12);
--ai-sum-heading-border: rgba(255, 107, 138, 0.55);
--ai-sum-name: #ffe0e8;
--font: "JetBrains Mono", ui-monospace, Consolas, monospace; --font: "JetBrains Mono", ui-monospace, Consolas, monospace;
--display: "Orbitron", var(--font); --display: "Orbitron", var(--font);
--mono: var(--font); --mono: var(--font);
@@ -103,6 +107,10 @@ html[data-theme="light"] {
--primary-btn-border: #005a82; --primary-btn-border: #005a82;
--status-done: #087a50; --status-done: #087a50;
--status-pending: #3d556d; --status-pending: #3d556d;
--ai-sum-heading: #9e1e38;
--ai-sum-heading-bg: rgba(201, 53, 82, 0.08);
--ai-sum-heading-border: rgba(201, 53, 82, 0.42);
--ai-sum-name: #7a182c;
color-scheme: light; color-scheme: light;
} }
@@ -3536,56 +3544,41 @@ body.hub-page-ai #page-ai {
} }
.ai-md-body.ai-result-md h2 { .ai-md-body.ai-result-md h2 {
font-size: 1.02rem; font-size: 1.02rem;
color: var(--red); color: var(--ai-sum-heading);
font-weight: 700;
margin: 14px 0 8px; margin: 14px 0 8px;
padding-bottom: 4px; padding: 6px 0 6px 10px;
border-left: 3px solid var(--ai-sum-heading-border);
border-bottom: 1px solid var(--border-soft); border-bottom: 1px solid var(--border-soft);
-webkit-text-stroke: 0.45px #fff; background: var(--ai-sum-heading-bg);
paint-order: stroke fill; border-radius: 0 4px 4px 0;
text-shadow:
0 0 1px #fff,
0 0 2px rgba(255, 255, 255, 0.9),
1px 0 0 #fff,
-1px 0 0 #fff,
0 1px 0 #fff,
0 -1px 0 #fff;
} }
.ai-md-body.ai-result-md h2:first-child { .ai-md-body.ai-result-md h2:first-child {
margin-top: 0; margin-top: 0;
} }
.ai-md-body.ai-result-md h3 { .ai-md-body.ai-result-md h3 {
font-size: 0.92rem; font-size: 0.92rem;
color: var(--red); color: var(--ai-sum-heading);
font-weight: 700;
margin: 16px 0 8px; margin: 16px 0 8px;
padding-bottom: 4px; padding: 5px 0 5px 10px;
border-left: 3px solid var(--ai-sum-heading-border);
border-bottom: 1px solid var(--border-soft); border-bottom: 1px solid var(--border-soft);
font-weight: 600; background: var(--ai-sum-heading-bg);
-webkit-text-stroke: 0.45px #fff; border-radius: 0 4px 4px 0;
paint-order: stroke fill;
text-shadow:
0 0 1px #fff,
0 0 2px rgba(255, 255, 255, 0.9),
1px 0 0 #fff,
-1px 0 0 #fff,
0 1px 0 #fff,
0 -1px 0 #fff;
} }
.ai-md-body.ai-result-md h3:first-of-type { .ai-md-body.ai-result-md h3:first-of-type {
margin-top: 4px; margin-top: 4px;
} }
.ai-md-body.ai-result-md h4 { .ai-md-body.ai-result-md h4 {
font-size: 0.92rem; font-size: 0.92rem;
color: var(--red); color: var(--ai-sum-heading);
font-weight: 700;
margin: 10px 0 6px; margin: 10px 0 6px;
-webkit-text-stroke: 0.45px #fff; padding: 4px 0 4px 8px;
paint-order: stroke fill; border-left: 2px solid var(--ai-sum-heading-border);
text-shadow: background: var(--ai-sum-heading-bg);
0 0 1px #fff, border-radius: 0 4px 4px 0;
0 0 2px rgba(255, 255, 255, 0.9),
1px 0 0 #fff,
-1px 0 0 #fff,
0 1px 0 #fff,
0 -1px 0 #fff;
} }
.ai-result-md h2 { .ai-result-md h2 {
font-size: 1.02rem; font-size: 1.02rem;
@@ -3664,15 +3657,7 @@ body.hub-page-ai #page-ai {
.ai-ac-name { .ai-ac-name {
min-width: 9rem; min-width: 9rem;
font-weight: 600; font-weight: 600;
color: var(--red); color: var(--ai-sum-name);
-webkit-text-stroke: 0.35px #fff;
paint-order: stroke fill;
text-shadow:
0 0 1px #fff,
1px 0 0 #fff,
-1px 0 0 #fff,
0 1px 0 #fff,
0 -1px 0 #fff;
} }
.ai-ac-remark { .ai-ac-remark {
color: var(--muted); color: var(--muted);
@@ -3773,17 +3758,12 @@ body.hub-page-ai #page-ai {
.ai-closed-trades-title { .ai-closed-trades-title {
margin: 0 0 6px; margin: 0 0 6px;
font-size: 0.82rem; font-size: 0.82rem;
font-weight: 600; font-weight: 700;
color: var(--red); color: var(--ai-sum-heading);
-webkit-text-stroke: 0.45px #fff; padding: 4px 0 4px 8px;
paint-order: stroke fill; border-left: 2px solid var(--ai-sum-heading-border);
text-shadow: background: var(--ai-sum-heading-bg);
0 0 1px #fff, border-radius: 0 4px 4px 0;
0 0 2px rgba(255, 255, 255, 0.9),
1px 0 0 #fff,
-1px 0 0 #fff,
0 1px 0 #fff,
0 -1px 0 #fff;
} }
.ai-msg-attachments { .ai-msg-attachments {
display: flex; display: flex;
+1 -1
View File
@@ -15,7 +15,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=20260607-hub-ai-v3" /> <link rel="stylesheet" href="/assets/app.css?v=20260607-hub-ai-v4" />
</head> </head>
<body> <body>
<div class="app-bg" aria-hidden="true"></div> <div class="app-bg" aria-hidden="true"></div>