feat: apply B-147 visual tokens to shell and three representative pages

Closes B-156

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 00:43:09 +08:00
co-authored by Cursor multica-agent
parent b60a4cb682
commit e778c883db
16 changed files with 836 additions and 331 deletions
+68 -56
View File
@@ -884,19 +884,21 @@
min-width: 0px;
min-height: 33px;
min-height: 0px;
display: flex;
flex: 0 0 auto;
flex-direction: row;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 6px;
align-items: flex-start;
padding: 0px 10px 0px 0px;
gap: 2px;
padding: 0 16px;
border: 0px;
}
@@ -924,11 +926,11 @@
}
.overview-strip .sentiment-text {
color: var(--r2-ink);
color: var(--accent);
font-size: 12px;
font-size: var(--fs-caption);
font-weight: 600;
font-weight: 500;
white-space: nowrap;
}
@@ -1037,25 +1039,31 @@
align-items: flex-start;
gap: 16px;
gap: 14px;
padding: 14px 16px;
padding: 14px 16px 10px;
}
.sentiment-current-phase-badge {
min-width: 94px;
min-width: 92px;
flex: 0 0 auto;
display: block;
display: flex;
padding: 10px 18px;
flex-direction: column;
border: 1px solid rgb(245, 207, 201);
align-items: center;
border-radius: 10px;
gap: 2px;
background: var(--r2-up-soft);
padding: 10px 16px;
border: 1px solid var(--accent);
border-radius: var(--card-radius);
background: var(--accent-soft);
text-align: center;
}
@@ -1063,11 +1071,11 @@
.sentiment-current-phase-badge strong {
display: block;
color: var(--r2-up);
color: var(--accent);
font-size: 19px;
font-weight: 800;
font-weight: 700;
line-height: 1.35;
}
@@ -1075,11 +1083,11 @@
.sentiment-current-phase-badge span {
display: block;
margin-top: 2px;
margin-top: 0;
color: var(--r2-sub);
color: var(--text-3);
font-size: 11px;
font-size: var(--fs-aux);
white-space: nowrap;
}
@@ -1091,15 +1099,17 @@
}
.sentiment-phase-info p {
color: var(--r2-sub);
color: var(--text-2);
font-size: 12.5px;
font-size: var(--fs-label);
line-height: 1.7;
line-height: 1.6;
}
.sentiment-phase-info p b {
font-weight: 700;
color: var(--text-1);
font-weight: 600;
}
.sentiment-phase-info p .down {
@@ -1113,17 +1123,17 @@
.sentiment-phase-advice {
margin-top: 8px;
padding: 5px 9px;
padding: 8px 10px;
border-radius: 6px;
border-radius: var(--radius-md);
background: var(--r2-amber-soft);
background: var(--surface-muted);
color: var(--r2-amber);
color: var(--text-2);
font-size: 12px;
font-size: var(--fs-caption);
line-height: 1.6;
line-height: 1.55;
}
.sentiment-feedback-strip {
@@ -1131,45 +1141,47 @@
grid-template-columns: 1fr 1fr;
border-top: 1px solid var(--r2-line-soft);
border-top: 1px solid var(--border);
}
.sentiment-feedback-strip > span {
min-width: 0px;
display: grid;
display: flex;
grid-template-columns: auto 1fr;
flex-wrap: wrap;
gap: 2px 8px;
align-items: baseline;
padding: 8px 12px;
gap: 2px 6px;
color: var(--r2-faint);
padding: 9px 14px;
font-size: 10.5px;
color: var(--text-3);
font-size: var(--fs-caption);
}
.sentiment-feedback-strip > span + span {
border-left: 1px solid var(--r2-line-soft);
border-left: 1px solid var(--border);
}
.sentiment-feedback-strip strong {
color: var(--r2-ink);
color: var(--text-1);
font-size: 11.5px;
font-size: inherit;
text-align: right;
font-weight: 600;
text-align: left;
}
.sentiment-feedback-strip small {
grid-column: 1 / -1;
overflow: hidden;
color: var(--r2-sub);
color: var(--text-3);
font-size: 10px;
font-size: var(--fs-aux);
text-overflow: ellipsis;
@@ -1399,17 +1411,17 @@
}
.overview-strip .sentiment-block .sentiment-text {
display: block;
display: inline-flex;
margin: 0px;
padding: 0px;
padding: 0 6px;
font-size: 11px;
font-size: var(--fs-caption);
font-weight: 500;
line-height: 1;
line-height: 18px;
letter-spacing: 0px;
@@ -1478,19 +1490,19 @@
}
.overview-strip[data-overview-expanded="true"] .sentiment-block {
min-height: 76px;
min-height: 0;
justify-content: center;
gap: 4px;
gap: 2px;
padding: 10px 16px;
padding: 0 16px;
flex-direction: row;
flex-direction: column;
align-items: center;
align-items: flex-start;
border-right: 1px solid var(--line-soft);
border-right: 0;
background: transparent;
}