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

feat: apply B-147 visual tokens to screener, review and account surfaces

Browse Source 
Unify intelligent screener, review workspace, and account/admin chrome with shared tokens, table density, and left-aligned first columns.

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 06:39:25 +08:00
co-authored by Cursor multica-agent
parent ee37223722
commit 22d4dcd339
7 changed files with 394 additions and 293 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/config/architecture-inventory.json
+6 -6
View File
@@ -373,12 +373,12 @@
"/shared/tokens.css?v=20260820-2",
"/shared/base.css?v=20260806-1",
"/shared/shell.css?v=20260820-2",
"/shared/auth.css?v=20260806-1",
"/shared/auth.css?v=20260820-3",
"/shared/components/controls.css?v=20260820-1",
"/shared/components/navigation.css?v=20260820-1",
"/shared/components/cards.css?v=20260820-1",
"/shared/components/tables.css?v=20260820-1",
"/shared/components/dialogs.css?v=20260806-1",
"/shared/components/dialogs.css?v=20260820-3",
"/shared/components/feedback.css?v=20260806-1",
"/pages/market/foundation.css?v=20260806-1",
"/pages/sentiment/foundation.css?v=20260820-2",
@@ -389,10 +389,10 @@
"/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/screener/foundation.css?v=20260820-3",
"/pages/mentor/foundation.css?v=20260820-2",
"/pages/heaven/foundation.css?v=20260806-2",
"/pages/review/foundation.css?v=20260806-1"
"/pages/review/foundation.css?v=20260820-3"
],
"frontend_composition": {
"shell": "frontend/index.html",
@@ -441,8 +441,8 @@
},
{
"path": "frontend/pages/screener/foundation.css",
"bytes": 102987,
"lines": 6565
"bytes": 103623,
"lines": 6580
},
{
"path": "frontend/pages/heaven/page.js",
app/frontend/index.html
+4 -4
View File
@@ -20,12 +20,12 @@
<link rel="stylesheet" href="/shared/tokens.css?v=20260820-2">
<link rel="stylesheet" href="/shared/base.css?v=20260806-1">
<link rel="stylesheet" href="/shared/shell.css?v=20260820-2">
<link rel="stylesheet" href="/shared/auth.css?v=20260806-1">
<link rel="stylesheet" href="/shared/auth.css?v=20260820-3">
<link rel="stylesheet" href="/shared/components/controls.css?v=20260820-1">
<link rel="stylesheet" href="/shared/components/navigation.css?v=20260820-1">
<link rel="stylesheet" href="/shared/components/cards.css?v=20260820-1">
<link rel="stylesheet" href="/shared/components/tables.css?v=20260820-1">
<link rel="stylesheet" href="/shared/components/dialogs.css?v=20260806-1">
<link rel="stylesheet" href="/shared/components/dialogs.css?v=20260820-3">
<link rel="stylesheet" href="/shared/components/feedback.css?v=20260806-1">
<link rel="stylesheet" href="/pages/market/foundation.css?v=20260806-1">
<link rel="stylesheet" href="/pages/sentiment/foundation.css?v=20260820-2">
@@ -36,10 +36,10 @@
<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/screener/foundation.css?v=20260820-3">
<link rel="stylesheet" href="/pages/mentor/foundation.css?v=20260820-2">
<link rel="stylesheet" href="/pages/heaven/foundation.css?v=20260806-2">
<link rel="stylesheet" href="/pages/review/foundation.css?v=20260806-1">
<link rel="stylesheet" href="/pages/review/foundation.css?v=20260820-3">
</head>
<body>
<section id="authGate" class="auth-gate" aria-label="账号登录">
app/frontend/pages/review/foundation.css
Vendored
+92 -87
View File
@@ -242,7 +242,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
border-radius: 10px;
box-shadow: var(--shadow-xs);
box-shadow: var(--shadow-card);
min-height: 0px !important;
}
@@ -276,15 +276,15 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
}
.watchlist-section .data-table thead th {
height: 32px;
height: 36px;
padding: 6px 12px;
padding: 0 12px;
}
.watchlist-section .data-table tbody td {
height: 44px;
height: 40px;
padding: 7px 12px;
padding: 0 12px;
}
.trade-journal-section .trade-log-summary:empty {
@@ -384,7 +384,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
}
#reviewWorkspaceView .review-history-toggle {
min-height: 30px;
min-height: 32px;
display: inline-flex;
@@ -398,13 +398,13 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
border: 1px solid var(--review-line);
border-radius: 7px;
border-radius: 8px;
background: var(--surface);
color: rgb(55, 65, 81);
color: var(--text-secondary);
font-size: 11.5px;
font-size: var(--font-size-label);
white-space: nowrap;
}
@@ -469,7 +469,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
background: var(--surface);
box-shadow: rgba(16, 24, 40, 0.05) 0px 1px 2px;
box-shadow: var(--shadow-card);
}
#reviewWorkspaceView .review-card-heading > div {
@@ -515,9 +515,9 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
}
#reviewWorkspaceView .data-table thead th {
height: 32px;
height: 36px;
padding: 6px 12px;
padding: 0 12px;
border-bottom: 1px solid var(--review-line-soft);
@@ -525,21 +525,21 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
color: var(--review-faint);
font-size: 10.5px;
font-size: var(--font-size-caption);
font-weight: 600;
font-weight: var(--font-weight-semibold);
}
#reviewWorkspaceView .data-table tbody td {
height: 48px;
height: 40px;
padding: 7px 12px;
padding: 0 12px;
border-bottom: 1px solid var(--review-line-soft);
color: rgb(55, 65, 81);
color: var(--text-primary);
font-size: 12px;
font-size: var(--font-size-table);
}
#reviewWorkspaceView .data-table tbody tr:last-child td {
@@ -559,17 +559,17 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
#reviewWorkspaceView .stock-cell strong {
color: var(--review-ink);
font-size: 12px;
font-size: var(--font-size-table);
}
#reviewWorkspaceView .stock-cell small {
color: var(--review-faint);
font-size: 10px;
font-size: var(--font-size-aux);
}
#reviewWorkspaceView .review-watch-mark {
color: rgb(209, 213, 219);
color: var(--text-tertiary);
font-size: 15px;
@@ -577,7 +577,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
}
#reviewWorkspaceView .review-watch-mark.red {
color: rgb(224, 69, 54);
color: var(--market-up);
}
#reviewWorkspaceView .review-row-actions {
@@ -601,19 +601,19 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
}
#reviewWorkspaceView .table-action {
min-height: 25px;
min-height: 32px;
padding: 0px 6px;
border: 0px;
border-radius: 5px;
border-radius: 8px;
background: transparent;
color: var(--review-blue);
font-size: 10.5px;
font-size: var(--font-size-label);
}
#reviewWorkspaceView .table-action:hover {
@@ -621,13 +621,13 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
}
#reviewWorkspaceView .table-action.down {
color: rgb(139, 146, 158);
color: var(--text-tertiary);
}
#reviewWorkspaceView .table-action.down:hover {
background: var(--surface-hover);
color: rgb(209, 67, 67);
color: var(--market-up);
}
#reviewWorkspaceView .trade-log-table-frame .empty-state {
@@ -667,7 +667,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
}
#reviewWorkspaceView .trade-log-heading .button {
min-height: 29px;
min-height: 32px;
display: inline-flex;
@@ -679,13 +679,13 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
padding: 0px 10px;
border-radius: 7px;
border-radius: 8px;
background: var(--review-blue);
color: var(--text-inverse);
font-size: 11.5px;
font-size: var(--font-size-label);
}
#reviewWorkspaceView .trade-log-heading .button:hover {
@@ -831,35 +831,35 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
}
#reviewWorkspaceView .trade-action-add {
border-color: rgb(241, 196, 192);
border-color: var(--market-up);
background: rgb(253, 236, 234);
background: var(--market-up-soft);
color: rgb(214, 62, 50);
color: var(--market-up);
}
#reviewWorkspaceView .trade-action-buy {
border-color: rgb(241, 196, 192);
border-color: var(--market-up);
background: rgb(253, 236, 234);
background: var(--market-up-soft);
color: rgb(214, 62, 50);
color: var(--market-up);
}
#reviewWorkspaceView .trade-action-sell {
border-color: rgb(188, 225, 202);
border-color: var(--market-down);
background: rgb(234, 247, 239);
background: var(--market-down-soft);
color: rgb(22, 139, 67);
color: var(--market-down);
}
#reviewWorkspaceView .trade-action-trim {
border-color: rgb(188, 225, 202);
border-color: var(--market-down);
background: rgb(234, 247, 239);
background: var(--market-down-soft);
color: rgb(22, 139, 67);
color: var(--market-down);
}
#reviewWorkspaceView .trade-tags {
@@ -879,7 +879,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
background: var(--review-blue-soft);
color: rgb(82, 112, 167);
color: var(--action);
font-size: 8.5px;
}
@@ -899,7 +899,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
white-space: nowrap;
color: rgb(75, 85, 99);
color: var(--text-secondary);
font-size: 10.5px;
@@ -989,7 +989,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
}
#reviewWorkspaceView .journal-form .button {
min-height: 34px;
min-height: 32px;
display: inline-flex;
@@ -1001,13 +1001,13 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
padding: 0px 14px;
border-radius: 7px;
border-radius: 8px;
background: var(--review-blue);
color: var(--text-inverse);
font-size: 12px;
font-size: var(--font-size-label);
}
#reviewWorkspaceView .journal-form .button:hover {
@@ -1247,9 +1247,9 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
color: var(--review-ink);
font-size: 19px;
font-size: var(--font-size-page-title);
font-weight: 750;
font-weight: var(--font-weight-semibold);
}
#reviewWorkspaceView .review-page-title .section-subtitle {
@@ -1261,7 +1261,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
white-space: nowrap;
font-size: 12px;
font-size: var(--font-size-caption);
}
#reviewWorkspaceView .review-card-heading {
@@ -1285,13 +1285,13 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
color: var(--review-ink);
font-size: 14.5px;
font-size: var(--font-size-card-title);
font-weight: 720;
font-weight: var(--font-weight-semibold);
}
#reviewWorkspaceView .review-add-watch {
min-height: 29px;
min-height: 32px;
display: inline-flex;
@@ -1303,23 +1303,23 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
padding: 0px 10px;
border: 1px solid rgb(185, 205, 248);
border: 1px solid var(--color-action-line);
border-radius: 7px;
border-radius: 8px;
background: rgb(245, 248, 255);
background: var(--action-soft);
color: var(--review-blue);
font-size: 11.5px;
font-size: var(--font-size-label);
font-weight: 650;
font-weight: var(--font-weight-semibold);
}
#reviewWorkspaceView .review-add-watch:hover {
border-color: rgb(142, 176, 244);
border-color: var(--action);
background: rgb(234, 241, 255);
background: var(--selected);
}
#reviewWorkspaceView .review-add-watch .lucide {
@@ -1374,17 +1374,17 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
}
#reviewWorkspaceView .review-watchlist-table .stock-cell strong {
font-size: 12.5px;
font-size: var(--font-size-table);
font-weight: 680;
font-weight: var(--font-weight-semibold);
}
#reviewWorkspaceView .review-watchlist-table .stock-cell small {
font-size: 10.5px;
font-size: var(--font-size-aux);
}
#reviewWorkspaceView .watch-attention-score {
color: rgb(63, 75, 94);
color: var(--text-primary);
font-size: 12px;
@@ -1452,11 +1452,11 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
#reviewWorkspaceView .journal-summary-field input:focus {
border-color: var(--review-blue-line);
box-shadow: rgba(37, 99, 235, 0.08) 0px 0px 0px 2px;
box-shadow: 0 0 0 2px var(--focus-ring);
}
#reviewWorkspaceView .journal-summary-field input::placeholder {
color: rgb(166, 173, 183);
color: var(--text-tertiary);
}
#reviewWorkspaceView .journal-form textarea {
@@ -1543,7 +1543,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
.watchlist-editor-form .form-field > label,
.watchlist-editor-form .form-field > span {
color: rgb(55, 65, 81);
color: var(--text-secondary);
font-size: 12px;
@@ -1561,7 +1561,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
padding: 0px 11px;
border: 1px solid rgb(223, 227, 232);
border: 1px solid var(--border-strong);
border-radius: 8px;
@@ -1569,9 +1569,9 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
}
.watchlist-search-control:focus-within {
border-color: rgb(184, 202, 244);
border-color: var(--color-action-line);
box-shadow: rgba(37, 99, 235, 0.07) 0px 0px 0px 3px;
box-shadow: 0 0 0 3px var(--focus-ring);
}
.watchlist-search-control .lucide {
@@ -1579,7 +1579,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
height: 15px;
color: rgb(154, 163, 176);
color: var(--text-tertiary);
}
.watchlist-search-control input {
@@ -1591,7 +1591,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
outline: 0px;
color: rgb(31, 41, 55);
color: var(--text-primary);
font-style: inherit;
@@ -1645,13 +1645,13 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
border-style: none none solid;
border-color: currentcolor currentcolor rgb(238, 240, 243);
border-color: currentcolor currentcolor var(--border);
border-image: none;
background: var(--surface);
color: rgb(31, 41, 55);
color: var(--text-primary);
text-align: left;
}
@@ -1673,7 +1673,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
}
.watchlist-search-results button small {
color: rgb(139, 148, 161);
color: var(--text-tertiary);
font-size: 10.5px;
}
@@ -1681,7 +1681,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
.watchlist-search-results button > b {
margin-left: auto;
color: rgb(105, 115, 134);
color: var(--text-secondary);
font-size: 11px;
@@ -1691,7 +1691,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
.watchlist-search-status {
padding: 14px 10px;
color: rgb(139, 148, 161);
color: var(--text-tertiary);
font-size: 11.5px;
@@ -1709,7 +1709,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
padding: 10px 12px;
border: 1px solid rgb(220, 229, 247);
border: 1px solid var(--action-soft);
border-radius: 8px;
@@ -1733,9 +1733,9 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
border-radius: 7px;
background: rgb(232, 239, 255);
background: var(--action-soft);
color: rgb(37, 99, 235);
color: var(--action);
}
.watchlist-selection-icon .lucide {
@@ -1753,7 +1753,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
}
.watchlist-selection strong {
color: rgb(31, 41, 55);
color: var(--text-primary);
font-size: 13.5px;
}
@@ -1763,13 +1763,13 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
gap: 8px;
color: rgb(123, 132, 145);
color: var(--text-tertiary);
font-size: 10.5px;
}
.watchlist-selection span b {
color: rgb(82, 96, 113);
color: var(--text-secondary);
font-weight: 600;
}
@@ -1791,7 +1791,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
resize: vertical;
border: 1px solid rgb(223, 227, 232);
border: 1px solid var(--border-strong);
border-radius: 8px;
@@ -1825,9 +1825,9 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
}
.watchlist-editor-form textarea:focus {
border-color: rgb(184, 202, 244);
border-color: var(--color-action-line);
box-shadow: rgba(37, 99, 235, 0.07) 0px 0px 0px 3px;
box-shadow: 0 0 0 3px var(--focus-ring);
}
#reviewWorkspaceView .trade-log-table th:nth-child(1) {
@@ -1873,7 +1873,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
font-size: 12px;
font-weight: 650;
font-weight: var(--font-weight-semibold);
min-height: 0px;
@@ -2201,3 +2201,8 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
height: auto;
}
}
#reviewWorkspaceView .data-table thead th:first-child,
#reviewWorkspaceView .data-table tbody td:first-child {
text-align: left;
}
app/frontend/pages/screener/foundation.css
Vendored
+111 -96
View File
@@ -1,8 +1,8 @@
/* Canonical CSS owner: screener. Historical layers consolidated 2026-08-02. */
#screenerView .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) {
@@ -25,7 +25,7 @@
.curated-detail-header > div > span,
.quant-panel-heading span {
color: rgb(100, 116, 139);
color: var(--text-secondary);
font-size: 12px;
@@ -35,7 +35,7 @@
:where(#screenerView) .curated-detail-header h3 {
margin: 3px 0px 0px;
color: rgb(17, 24, 39);
color: var(--text-primary);
letter-spacing: 0px;
}
@@ -45,7 +45,7 @@
border-radius: 5px;
background: rgb(232, 238, 252);
background: var(--action-soft);
}
:where(#screenerView) .curated-search .lucide {
@@ -55,19 +55,19 @@
:where(#screenerView) .curated-search input {
background: transparent;
color: rgb(17, 24, 39);
color: var(--text-primary);
}
.curated-strategy-card.active .curated-strategy-rank {
background: rgb(220, 232, 255);
background: var(--action-soft);
color: rgb(29, 78, 216);
color: var(--action);
}
:where(#screenerView) .curated-detail-header p {
margin: 9px 0px 0px;
color: rgb(100, 116, 139);
color: var(--text-secondary);
}
.curated-strategy-badges {
@@ -87,9 +87,9 @@
border-radius: 5px;
background: rgb(241, 245, 249);
background: var(--hover);
color: rgb(71, 85, 105);
color: var(--text-secondary);
font-weight: 650;
@@ -97,9 +97,9 @@
}
.curated-strategy-badges span:first-child {
background: rgb(234, 241, 255);
background: var(--action-soft);
color: rgb(29, 78, 216);
color: var(--action);
}
:where(#screenerView) .mini-section-heading {
@@ -111,11 +111,11 @@
:where(#screenerView) .mini-section-heading h4 {
font-weight: 740;
color: rgb(31, 41, 55);
color: var(--text-primary);
}
.mini-section-heading > span {
color: rgb(100, 116, 139);
color: var(--text-secondary);
font-size: 12px;
}
@@ -141,15 +141,15 @@
gap: 12px;
border-bottom: 1px solid rgb(238, 240, 243);
border-bottom: 1px solid var(--border);
}
:where(#screenerView) .curated-rule-row span {
color: rgb(71, 85, 105);
color: var(--text-secondary);
}
:where(#screenerView) .curated-rule-row strong {
color: rgb(17, 24, 39);
color: var(--text-primary);
font-variant-numeric: tabular-nums;
}
@@ -163,7 +163,7 @@
.curated-score-row > span:first-child {
overflow: hidden;
color: rgb(71, 85, 105);
color: var(--text-secondary);
text-overflow: ellipsis;
@@ -177,7 +177,7 @@
border-radius: 4px;
background: rgb(237, 240, 244);
background: var(--surface-muted);
}
.curated-score-track i {
@@ -187,11 +187,11 @@
border-radius: inherit;
background: rgb(79, 118, 199);
background: var(--action);
}
.curated-score-row strong {
color: rgb(51, 65, 85);
color: var(--text-primary);
text-align: right;
@@ -211,11 +211,11 @@
}
:where(#screenerView) .curated-data-status > .lucide {
color: rgb(22, 163, 74);
color: var(--market-down);
}
.curated-data-status.missing > .lucide {
color: rgb(217, 119, 6);
color: var(--warning-color);
}
.curated-data-status span {
@@ -225,13 +225,13 @@
:where(#screenerView) .curated-data-status strong {
display: block;
color: rgb(51, 65, 85);
color: var(--text-primary);
}
:where(#screenerView) .curated-data-status small {
display: block;
color: rgb(124, 135, 152);
color: var(--text-tertiary);
}
.quant-universe-grid .form-field {
@@ -239,16 +239,16 @@
}
.quant-universe-grid input[type="number"] {
height: 40px;
height: 32px;
}
.quant-rule-row input:focus,
.quant-rule-row select:focus {
border-color: rgb(37, 99, 235);
border-color: var(--action);
outline: 0px;
box-shadow: rgba(37, 99, 235, 0.1) 0px 0px 0px 3px;
box-shadow: 0 0 0 3px var(--focus-ring);
}
:where(#screenerView) .quant-remove-button {
@@ -268,7 +268,7 @@
float: right;
color: rgb(29, 78, 216);
color: var(--action);
}
:where(#screenerView) .quant-weight-status > div {
@@ -278,7 +278,7 @@
:where(#screenerView) .quant-weight-status i {
width: 100%;
background: rgb(37, 99, 235);
background: var(--action);
transition: width 180ms, background 180ms;
}
@@ -305,7 +305,7 @@
}
.quant-summary-pane {
border-top: 1px solid rgb(229, 231, 235);
border-top: 1px solid var(--border);
border-left: 0px;
}
@@ -549,7 +549,7 @@
padding: 12px;
background: rgb(248, 249, 251);
background: var(--surface-subtle);
}
#screenerView .strategy-list {
@@ -575,7 +575,7 @@
}
#screenerView .strategy-item.active {
border-color: rgb(201, 219, 241);
border-color: var(--color-action-line);
background: var(--action-soft);
}
@@ -724,7 +724,7 @@
#screenerView .backtest-panel {
padding: 10px 14px 12px;
background: rgb(251, 252, 253);
background: var(--surface-subtle);
}
#screenerView .backtest-panel > .workspace-heading {
@@ -1099,7 +1099,7 @@
}
.tracking-status.active {
border-color: rgb(197, 215, 237);
border-color: var(--color-action-line);
background: var(--action-soft);
@@ -1107,7 +1107,7 @@
}
.tracking-status.complete {
border-color: rgb(185, 223, 207);
border-color: var(--market-down);
background: var(--market-down-soft);
@@ -1149,9 +1149,9 @@
border-radius: 50%;
background: rgb(229, 231, 235);
background: var(--border);
color: rgb(156, 163, 175);
color: var(--text-tertiary);
font-size: 11px;
@@ -1189,11 +1189,11 @@
.screener-strategy-title b.neutral {
background: var(--surface-muted);
color: rgb(107, 114, 128);
color: var(--text-secondary);
}
:where(#screenerView) .screener-strategy-summary p {
color: rgb(107, 114, 128);
color: var(--text-secondary);
font-size: 12px;
}
@@ -1225,7 +1225,7 @@
border-right: 0px;
border-bottom-color: rgb(238, 240, 243);
border-bottom-color: var(--border);
}
#screenerView .screener-result-frame th {
@@ -1235,13 +1235,13 @@
border-right: 0px;
border-bottom-color: rgb(238, 240, 243);
border-bottom-color: var(--border);
height: 38px;
background: var(--table-header);
color: rgb(107, 114, 128);
color: var(--text-secondary);
font-size: 12px;
}
@@ -1281,7 +1281,7 @@
background: var(--surface);
box-shadow: rgba(15, 23, 42, 0.16) -12px 0px 32px;
box-shadow: var(--shadow-float);
}
.strategy-drawer[open] {
@@ -1323,7 +1323,7 @@
}
.strategy-drawer-header span {
color: rgb(156, 163, 175);
color: var(--text-tertiary);
font-size: 10.5px;
}
@@ -1365,7 +1365,7 @@
border-bottom: 1px solid var(--border);
background: rgb(248, 249, 251);
background: var(--surface-subtle);
}
#screenerView .strategy-drawer .strategy-list {
@@ -1602,7 +1602,7 @@
padding-top: 5px;
border-top: 1px solid rgb(238, 240, 243);
border-top: 1px solid var(--border);
}
#screenerView .screener-backtest-strip {
@@ -1684,7 +1684,7 @@
background: var(--surface);
color: rgb(31, 41, 55);
color: var(--text-primary);
font-style: inherit;
@@ -1722,7 +1722,7 @@
padding: 0px 9px;
color: rgb(31, 41, 55);
color: var(--text-primary);
font: inherit;
@@ -1749,7 +1749,7 @@
.curated-library-pane {
border-right: 0px;
border-bottom: 1px solid rgb(229, 231, 235);
border-bottom: 1px solid var(--border);
display: block;
@@ -1788,9 +1788,9 @@
}
.curated-search:focus-within {
border-color: rgb(142, 172, 239);
border-color: var(--action);
box-shadow: rgba(53, 106, 230, 0.1) 0px 0px 0px 3px;
box-shadow: 0 0 0 3px var(--focus-ring);
}
:where(#screenerView) .screener-page-heading {
@@ -1824,7 +1824,7 @@
}
:where(#screenerView) .curated-library-heading h3 {
color: rgb(17, 24, 39);
color: var(--text-primary);
letter-spacing: 0px;
}
@@ -1870,7 +1870,7 @@
justify-content: space-between;
border-bottom: 1px solid rgb(232, 235, 239);
border-bottom: 1px solid var(--border);
}
:where(#screenerView) .curated-execution-bar {
@@ -1890,7 +1890,7 @@
}
#screenerView .regime-evidence strong {
color: rgb(146, 88, 6);
color: var(--warning-color);
font-size: 12px;
@@ -1902,7 +1902,7 @@
overflow: visible;
color: rgb(162, 106, 24);
color: var(--warning-color);
font-size: 10.5px;
@@ -2350,7 +2350,7 @@ body[data-active-view="screenerView"] .overview-strip {
}
:where(#screenerView) .curated-strategy-card:hover {
box-shadow: rgba(37, 99, 235, 0.08) 0px 4px 14px;
box-shadow: var(--shadow-raised);
}
:where(#screenerView) .quant-screener-panel {
@@ -2414,7 +2414,7 @@ body[data-active-view="screenerView"] .overview-strip {
border-radius: 999px;
background: rgb(223, 229, 238);
background: var(--border-strong);
accent-color: var(--primary);
@@ -2532,19 +2532,19 @@ body[data-active-view="screenerView"] .overview-strip {
color: var(--r2-ink);
font-size: 17px;
font-size: var(--font-size-page-title);
font-weight: 800;
font-weight: var(--font-weight-semibold);
}
#screenerView .screener-page-heading .section-subtitle {
color: var(--r2-faint);
font-size: 12px;
font-size: var(--font-size-caption);
}
#screenerView .screener-mode-tabs {
min-height: 34px;
min-height: 32px;
display: inline-flex;
@@ -2662,7 +2662,7 @@ body[data-active-view="screenerView"] .overview-strip {
}
#screenerView .step-line.complete {
background: rgb(134, 213, 160);
background: var(--market-down);
}
#screenerView .screener-overview-card {
@@ -2712,7 +2712,7 @@ body[data-active-view="screenerView"] .overview-strip {
border-radius: 5px;
background: rgb(244, 246, 248);
background: var(--surface-muted);
color: var(--r2-sub);
@@ -2766,7 +2766,7 @@ body[data-active-view="screenerView"] .overview-strip {
}
#screenerView .regime-option:hover {
border-color: rgb(187, 200, 219);
border-color: var(--border-strong);
color: var(--r2-ink);
}
@@ -2979,7 +2979,7 @@ body[data-active-view="screenerView"] .overview-strip {
#screenerView .result-toolbar .count-badge {
border-radius: 5px;
background: rgb(241, 243, 246);
background: var(--surface-muted);
color: var(--r2-sub);
@@ -3039,25 +3039,29 @@ body[data-active-view="screenerView"] .overview-strip {
}
#screenerView .data-table {
font-size: 11.5px;
font-size: var(--font-size-table);
}
#screenerView .data-table thead th {
height: 39px;
height: 36px;
padding: 8px 11px;
padding: 0 12px;
background: var(--table-header);
color: var(--r2-sub);
font-size: 10.5px;
font-size: var(--font-size-caption);
font-weight: var(--font-weight-semibold);
}
#screenerView .data-table tbody td {
height: 45px;
height: 40px;
padding: 8px 11px;
padding: 0 12px;
font-size: var(--font-size-table);
}
#screenerView .data-table .stock-name {
@@ -3069,7 +3073,7 @@ body[data-active-view="screenerView"] .overview-strip {
overflow: hidden;
color: rgb(95, 107, 124);
color: var(--text-secondary);
text-overflow: ellipsis;
}
@@ -3091,13 +3095,13 @@ body[data-active-view="screenerView"] .overview-strip {
#screenerView .probability-value small {
margin-top: 3px;
font-weight: 500;
font-weight: var(--font-weight-medium);
display: block;
color: var(--r2-faint);
font-size: 9px;
font-size: var(--font-size-aux);
}
#screenerView .tracking-summary {
@@ -3341,7 +3345,7 @@ body[data-active-view="screenerView"] .overview-strip {
}
#screenerView .curated-school-filters button.active {
border-color: rgb(197, 212, 241);
border-color: var(--color-action-line);
background: var(--scr-blue-soft);
@@ -3562,7 +3566,7 @@ body[data-active-view="screenerView"] .overview-strip {
border-radius: 5px;
background: rgb(238, 241, 245);
background: var(--surface-muted);
color: var(--r2-sub);
@@ -3598,7 +3602,7 @@ body[data-active-view="screenerView"] .overview-strip {
border-radius: 4px;
background: rgb(238, 241, 245);
background: var(--surface-muted);
color: var(--r2-faint);
@@ -3953,7 +3957,7 @@ body[data-active-view="screenerView"] .overview-strip {
border-radius: 6px;
background: rgb(247, 248, 250);
background: var(--surface-subtle);
}
#screenerView .quant-rule-rows {
@@ -3989,7 +3993,7 @@ body[data-active-view="screenerView"] .overview-strip {
min-height: 30px;
border: 1px solid rgb(220, 225, 232);
border: 1px solid var(--border-strong);
border-radius: 6px;
@@ -4003,7 +4007,7 @@ body[data-active-view="screenerView"] .overview-strip {
min-height: 30px;
border: 1px solid rgb(220, 225, 232);
border: 1px solid var(--border-strong);
border-radius: 6px;
@@ -4075,7 +4079,7 @@ body[data-active-view="screenerView"] .overview-strip {
border-radius: 3px;
background: rgb(232, 235, 240);
background: var(--surface-muted);
}
#screenerView .quant-weight-status i {
@@ -4109,7 +4113,7 @@ body[data-active-view="screenerView"] .overview-strip {
}
#screenerView .strategy-drawer::backdrop {
background: rgba(20, 29, 44, 0.38);
background: var(--backdrop);
backdrop-filter: blur(3px);
}
@@ -4587,7 +4591,7 @@ body[data-active-view="screenerView"] .overview-strip {
}
#screenerTrackingView .tracking-back-button:hover {
border-color: rgb(185, 200, 228);
border-color: var(--color-action-line);
color: var(--scr-blue);
}
@@ -4743,23 +4747,27 @@ body[data-active-view="screenerView"] .overview-strip {
}
#screenerTrackingView .data-table {
font-size: 11.5px;
font-size: var(--font-size-table);
}
#screenerTrackingView .data-table thead th {
height: 39px;
height: 36px;
padding: 8px 11px;
padding: 0 12px;
background: var(--table-header);
font-size: 10.5px;
font-size: var(--font-size-caption);
font-weight: var(--font-weight-semibold);
}
#screenerTrackingView .data-table tbody td {
height: 46px;
height: 40px;
padding: 8px 11px;
padding: 0 12px;
font-size: var(--font-size-table);
}
#screenerTrackingView .stock-cell {
@@ -4775,7 +4783,7 @@ body[data-active-view="screenerView"] .overview-strip {
#screenerTrackingView .stock-cell small {
color: var(--r2-faint);
font-size: 9px;
font-size: var(--font-size-aux);
}
#screenerTrackingView .table-action.danger {
@@ -5495,7 +5503,7 @@ body[data-active-view="screenerView"] .overview-strip {
flex-direction: column;
border: 1px solid rgb(243, 201, 195);
border: 1px solid var(--market-up);
border-radius: 9px;
@@ -5677,7 +5685,7 @@ body[data-active-view="screenerView"] .overview-strip {
}
#screenerView .screener-tracking-entry:focus-visible {
outline: rgba(37, 99, 235, 0.45) solid 2px;
outline: 2px solid var(--action);
outline-offset: 2px;
}
@@ -5729,11 +5737,11 @@ body[data-active-view="screenerView"] .overview-strip {
padding: 3px 8px;
border: 1px solid rgb(217, 226, 239);
border: 1px solid var(--border-strong);
border-radius: 5px;
background: rgb(247, 249, 252);
background: var(--surface-subtle);
color: var(--r2-sub);
@@ -6563,3 +6571,10 @@ body[data-active-view="screenerView"] .overview-strip {
gap: 3px;
}
}
#screenerView .data-table thead th:first-child,
#screenerView .data-table tbody td:first-child,
#screenerTrackingView .data-table thead th:first-child,
#screenerTrackingView .data-table tbody td:first-child {
text-align: left;
}
app/frontend/shared/auth.css
+76 -74
View File
@@ -12,7 +12,7 @@
padding: 20px;
background: rgb(237, 241, 244);
background: var(--canvas);
}
.auth-gate[hidden] {
@@ -26,13 +26,13 @@
padding: 26px;
border: 1px solid var(--line-strong);
border: 1px solid var(--border-strong);
border-radius: 6px;
border-radius: 12px;
background: var(--surface);
box-shadow: var(--shadow);
box-shadow: var(--shadow-raised);
}
.auth-brand {
@@ -46,7 +46,9 @@
.auth-brand h1 {
margin: 0px;
font-size: 22px;
font-size: var(--font-size-page-title);
font-weight: var(--font-weight-semibold);
}
.auth-brand span {
@@ -54,9 +56,9 @@
margin-top: 5px;
color: var(--text-muted);
color: var(--text-3);
font-size: 12px;
font-size: var(--font-size-caption);
}
.auth-tabs {
@@ -88,11 +90,11 @@
}
.auth-tab.active {
border-bottom-color: var(--coral);
border-bottom-color: var(--action);
color: var(--text);
color: var(--text-1);
font-weight: 750;
font-weight: var(--font-weight-semibold);
}
.auth-form {
@@ -106,15 +108,15 @@
.auth-form .button {
width: 100%;
min-height: 40px;
min-height: 32px;
}
.auth-error {
margin: 0px;
color: rgb(185, 54, 39);
color: var(--market-up);
font-size: 12px;
font-size: var(--font-size-caption);
line-height: 1.5;
}
@@ -146,23 +148,23 @@
.admin-section-picker select {
width: 100%;
min-height: 40px;
min-height: 32px;
padding: 0px 11px;
border: 1px solid var(--line-strong);
border: 1px solid var(--border-strong);
border-radius: 5px;
border-radius: 8px;
background: var(--surface);
color: var(--text-primary);
font-size: 13px;
font-size: var(--font-size-label);
}
.admin-section-picker select:focus-visible {
outline: 2px solid var(--blue);
outline: 2px solid var(--action);
outline-offset: 2px;
}
@@ -307,13 +309,13 @@
min-width: 0px;
height: 34px;
height: 32px;
padding: 0px 8px;
border: 1px solid var(--line-strong);
border: 1px solid var(--border-strong);
border-radius: 4px;
border-radius: 8px;
background: var(--surface);
}
@@ -386,11 +388,11 @@
}
.connection-status.connected {
border-color: rgb(167, 222, 201);
border-color: var(--market-down);
background: var(--green-soft);
color: rgb(8, 106, 75);
color: var(--market-down);
}
.settings-dialog form {
@@ -594,7 +596,7 @@
.account-dropdown button {
width: 100%;
min-height: 40px;
min-height: 36px;
display: grid;
@@ -636,7 +638,7 @@
outline: none;
box-shadow: inset 0 0 0 2px var(--focus-ring, #1268c4);
box-shadow: inset 0 0 0 2px var(--focus-ring);
}
.account-dropdown button svg {
@@ -662,16 +664,16 @@
}
.account-dropdown .account-menu-danger {
color: rgb(181, 58, 66);
color: var(--market-up);
grid-template-columns: 18px minmax(0px, 1fr);
}
.account-dropdown .account-menu-danger:focus-visible,
.account-dropdown .account-menu-danger:hover {
color: rgb(163, 47, 55);
color: var(--market-up);
background: rgb(255, 242, 243);
background: var(--market-up-soft);
}
button.account-role-badge {
@@ -685,11 +687,11 @@ button.account-role-badge {
button.account-role-badge:hover {
filter: brightness(0.98);
box-shadow: rgba(67, 76, 86, 0.14) 0px 3px 10px;
box-shadow: var(--shadow-card);
}
button.account-role-badge:focus-visible {
outline: 2px solid var(--blue);
outline: 2px solid var(--action);
outline-offset: 2px;
}
@@ -701,9 +703,9 @@ button.account-role-badge:focus-visible {
}
.admin-role-badge {
color: rgb(83, 103, 124);
color: var(--text-secondary);
background: rgb(244, 247, 250);
background: var(--surface-muted);
}
.vip-role-badge {
@@ -719,7 +721,7 @@ button.account-role-badge:focus-visible {
.vip-role-badge.is-nonmember {
color: rgb(105, 117, 128);
background: rgb(244, 246, 248);
background: var(--surface-muted);
border-color: rgb(203, 211, 218);
@@ -825,7 +827,7 @@ button.account-role-badge:focus-visible {
}
.member-gate strong {
color: rgb(60, 70, 80);
color: var(--text-primary);
font-size: 14px;
}
@@ -877,7 +879,7 @@ button.account-role-badge:focus-visible {
margin-bottom: 12px;
color: rgb(83, 103, 124);
color: var(--text-secondary);
}
.privacy-note svg {
@@ -889,7 +891,7 @@ button.account-role-badge:focus-visible {
margin-top: 3px;
color: rgb(52, 116, 95);
color: var(--market-down);
}
.membership-status-grid {
@@ -905,17 +907,17 @@ button.account-role-badge:focus-visible {
.membership-status-grid > div {
padding: 12px 13px;
border: 1px solid var(--line, #e2e8ee);
border: 1px solid var(--border);
border-radius: 10px;
background: rgb(251, 252, 253);
background: var(--surface-subtle);
}
.membership-status-grid span {
display: block;
color: rgb(116, 128, 140);
color: var(--text-tertiary);
font-size: 11px;
}
@@ -925,7 +927,7 @@ button.account-role-badge:focus-visible {
margin-top: 5px;
color: rgb(38, 50, 61);
color: var(--text-primary);
font-size: 15px;
@@ -935,7 +937,7 @@ button.account-role-badge:focus-visible {
.membership-comparison {
overflow: hidden;
border: 1px solid var(--line, #e2e8ee);
border: 1px solid var(--border);
border-radius: 10px;
@@ -953,7 +955,7 @@ button.account-role-badge:focus-visible {
padding: 9px 11px;
border-top: 1px solid var(--line, #e2e8ee);
border-top: 1px solid var(--border);
}
.membership-comparison > div:first-child {
@@ -961,21 +963,21 @@ button.account-role-badge:focus-visible {
}
.membership-comparison-head {
color: rgb(105, 118, 131);
color: var(--text-secondary);
background: rgb(247, 249, 251);
background: var(--surface-subtle);
font-weight: 700;
}
.membership-comparison b {
color: rgb(39, 108, 88);
color: var(--market-down);
font-weight: 600;
}
.membership-comparison b.muted {
color: rgb(154, 164, 173);
color: var(--text-tertiary);
}
.membership-comparison b.available {
@@ -993,7 +995,7 @@ button.account-role-badge:focus-visible {
margin-top: 14px;
color: rgb(93, 105, 116);
color: var(--text-secondary);
font-size: 12px;
}
@@ -1085,7 +1087,7 @@ button.account-role-badge:focus-visible {
}
.account-settings-dialog {
border-radius: 9px;
border-radius: 12px;
}
.settings-dialog {
@@ -1095,7 +1097,7 @@ button.account-role-badge:focus-visible {
overflow-x: hidden;
border-radius: 9px;
border-radius: 12px;
}
.account-dropdown {
@@ -1115,17 +1117,17 @@ button.account-role-badge:focus-visible {
padding: 7px;
background: rgba(255, 255, 255, 0.98);
background: var(--surface);
transform-origin: right top;
animation: account-menu-in 180ms var(--ease-out) both;
border-color: var(--border);
border: 1px solid var(--border);
border-radius: 7px;
border-radius: 8px;
box-shadow: rgba(22, 34, 46, 0.15) 0px 14px 35px;
box-shadow: var(--shadow-float);
}
@media (max-width: 767px) {
@@ -1214,7 +1216,7 @@ button.account-role-badge:focus-visible {
border-radius: 7px;
background: rgb(37, 99, 235);
background: var(--action);
color: var(--text-inverse);
@@ -1308,17 +1310,17 @@ button.account-role-badge:focus-visible {
.settings-dialog:not(.heaven-reading-dialog) .settings-section-heading h3 {
margin: 0px;
color: rgb(39, 52, 67);
color: var(--text-primary);
font-size: 14px;
font-size: var(--font-size-card-title);
font-weight: 720;
font-weight: var(--font-weight-semibold);
}
.settings-dialog:not(.heaven-reading-dialog) .settings-section-heading > span {
color: rgb(124, 135, 149);
color: var(--text-tertiary);
font-size: 10.5px;
font-size: var(--font-size-aux);
}
.settings-dialog:not(.heaven-reading-dialog) .form-field {
@@ -1327,7 +1329,7 @@ button.account-role-badge:focus-visible {
.settings-dialog:not(.heaven-reading-dialog) .form-field > label,
.settings-dialog:not(.heaven-reading-dialog) .form-field > span {
color: rgb(78, 91, 106);
color: var(--text-secondary);
font-size: 11px;
@@ -1335,7 +1337,7 @@ button.account-role-badge:focus-visible {
}
.settings-dialog:not(.heaven-reading-dialog) :is(input, select, textarea) {
border-color: rgb(213, 220, 229);
border-color: var(--border-strong);
border-radius: 7px;
}
@@ -1375,7 +1377,7 @@ button.account-role-badge:focus-visible {
}
.account-settings-dialog .settings-lead {
color: rgb(96, 109, 124);
color: var(--text-secondary);
font-size: 12px;
@@ -1397,7 +1399,7 @@ button.account-role-badge:focus-visible {
padding: 11px 12px;
border-color: rgb(223, 228, 234);
border-color: var(--border-strong);
border-radius: 7px;
@@ -1425,7 +1427,7 @@ button.account-role-badge:focus-visible {
}
.account-settings-dialog .membership-comparison {
border-color: rgb(223, 228, 234);
border-color: var(--border-strong);
border-radius: 7px;
}
@@ -1435,7 +1437,7 @@ button.account-role-badge:focus-visible {
padding: 8px 11px;
border-color: rgb(230, 234, 239);
border-color: var(--border);
}
.account-settings-dialog .membership-comparison-head {
@@ -1449,11 +1451,11 @@ button.account-role-badge:focus-visible {
.account-settings-dialog .privacy-note {
padding: 10px 11px;
border: 1px solid rgb(220, 232, 226);
border: 1px solid var(--market-down);
border-radius: 7px;
background: rgb(245, 250, 247);
background: var(--market-down-soft);
}
.account-settings-dialog .account-birth-form {
@@ -1475,7 +1477,7 @@ button.account-role-badge:focus-visible {
border-radius: 7px;
color: rgb(102, 115, 132);
color: var(--text-secondary);
font-size: 11px;
}
@@ -1489,7 +1491,7 @@ button.account-role-badge:focus-visible {
border-bottom: 1px solid var(--dialog-line);
background: rgb(251, 252, 253);
background: var(--surface-subtle);
}
.admin-dialog .admin-section-picker label {
@@ -1497,13 +1499,13 @@ button.account-role-badge:focus-visible {
}
.admin-dialog .admin-section-picker select {
min-height: 36px;
min-height: 32px;
border-color: rgb(212, 220, 229);
border-color: var(--border-strong);
border-radius: 7px;
border-radius: 8px;
font-size: 12px;
font-size: var(--font-size-label);
}
.admin-dialog .admin-panel {
@@ -1635,7 +1637,7 @@ button.account-role-badge:focus-visible {
}
:root[data-theme="dark"] :is(.loading-overlay, .auth-gate) {
background: color-mix(in srgb, var(--canvas) 92%, transparent);
background: var(--backdrop);
}
:root[data-theme="dark"] :is(.auth-shell) {
app/frontend/shared/components/dialogs.css
+28 -26
View File
@@ -10,7 +10,9 @@
.dialog-header h2 {
margin: 2px 0px 0px;
font-size: 19px;
font-size: 16px;
font-weight: var(--font-weight-semibold);
letter-spacing: 0px;
}
@@ -36,9 +38,9 @@
}
.admin-dialog .model-row {
border-color: rgb(223, 228, 234);
border-color: var(--border);
border-radius: 7px;
border-radius: 8px;
background: var(--surface-subtle);
}
@@ -240,11 +242,11 @@
}
.alert-button.has-alerts {
border-color: rgb(214, 180, 93);
border-color: var(--warning-color);
background: rgb(255, 249, 233);
background: var(--warning-soft);
color: rgb(138, 97, 0);
color: var(--warning-color);
}
.alert-badge {
@@ -526,17 +528,17 @@
}
.assistant-message.user .assistant-message-content {
border-color: rgb(190, 210, 235);
border-color: var(--color-action-line);
background: var(--action-soft);
}
.assistant-message.is-error .assistant-message-content {
border-color: rgb(239, 197, 200);
border-color: var(--market-up);
background: var(--market-up-soft);
color: rgb(139, 47, 52);
color: var(--market-up);
}
.assistant-message-content p {
@@ -778,7 +780,7 @@
gap: 16px;
padding: 14px 18px;
padding: 20px;
min-height: 62px;
@@ -786,7 +788,7 @@
}
.assistant-dialog {
border-radius: 9px;
border-radius: 12px;
width: min(820px, -32px + 100vw);
@@ -796,9 +798,9 @@
}
.dialog-eyebrow {
color: var(--text-muted);
color: var(--text-3);
font-size: 12px;
font-size: var(--font-size-caption);
}
.global-search-dialog {
@@ -806,7 +808,7 @@
border-radius: 8px;
box-shadow: rgba(26, 37, 47, 0.22) 0px 22px 70px, rgba(26, 37, 47, 0.1) 0px 3px 14px;
box-shadow: var(--shadow-float);
max-width: 700px;
@@ -892,13 +894,13 @@
font: 11px / 1.2 ui-monospace, SFMono-Regular, Consolas, monospace;
border-color: rgb(214, 221, 229);
border-color: var(--border-strong);
border-radius: 5px;
background: rgb(247, 248, 250);
background: var(--surface-subtle);
color: rgb(125, 136, 150);
color: var(--text-tertiary);
}
.global-search-results {
@@ -920,7 +922,7 @@
padding: 9px 10px 5px;
color: rgb(135, 146, 160);
color: var(--text-tertiary);
font-size: 10px;
}
@@ -957,9 +959,9 @@
.global-search-result.is-active,
.global-search-result:hover {
background: rgb(238, 244, 255);
background: var(--action-soft);
color: rgb(31, 85, 165);
color: var(--action);
}
.global-search-result-icon {
@@ -973,7 +975,7 @@
color: var(--text-muted);
border-color: rgb(224, 229, 235);
border-color: var(--border);
border-radius: 7px;
@@ -1003,7 +1005,7 @@
border-color: var(--dialog-line);
background: rgb(251, 252, 253);
background: var(--surface-subtle);
}
.alerts-dialog .alert-form {
@@ -1077,7 +1079,7 @@
padding: 16px 18px;
background: rgb(247, 249, 251);
background: var(--surface-subtle);
}
.assistant-dialog .assistant-message {
@@ -1087,9 +1089,9 @@
}
.assistant-dialog .assistant-message-content {
border-color: rgb(220, 227, 235);
border-color: var(--border);
border-radius: 7px;
border-radius: 8px;
font-size: 12.5px;
@@ -1197,7 +1199,7 @@
z-index: 95;
box-shadow: rgba(0, 0, 0, 0.12) -8px 0px 24px;
box-shadow: var(--shadow-float);
transition: right 0.25s;
app/tests/e2e/app-shell.spec.js
+77
View File
@@ -3300,3 +3300,80 @@ test("merged header keeps date, detail fields and 13 pool columns after dual-rev
}
await expect(page.locator("#dataDateMetric")).toBeVisible();
});
test("B-199 screener review and account surfaces fit day night viewports", async ({ page }) => {
const fs = require("node:fs");
const path = require("node:path");
const shotDir = path.join(__dirname, "../../runtime/b199-shots");
fs.mkdirSync(shotDir, { recursive: true });
const pageErrors = [];
page.on("pageerror", (error) => pageErrors.push(String(error)));
const overflowX = () => page.evaluate(() => document.documentElement.scrollWidth - window.innerWidth);
const shot = (name) => page.screenshot({ path: path.join(shotDir, `${name}.png`), fullPage: true });
await mockApplication(page, session("admin", true));
await page.setViewportSize({ width: 1600, height: 1000 });
await page.goto("/index.html");
await page.locator('[data-view="screenerView"]').first().click();
await expect(page.locator("#screenerView")).toHaveClass(/active-view/);
expect(await overflowX()).toBeLessThanOrEqual(1);
await shot("screener-1600-day");
await page.locator('[data-view="reviewWorkspaceView"]').first().click();
await expect(page.locator("#reviewWorkspaceView")).toHaveClass(/active-view/);
expect(await overflowX()).toBeLessThanOrEqual(1);
await shot("review-1600-day");
await openHeaderCommandMenu(page);
await page.locator("#accountButton").click();
await page.locator('[data-account-panel="membership"]').click();
await expect(page.locator("#settingsDialog")).toBeVisible();
await shot("account-1600-day");
await page.locator("#closeSettingsDialog").click();
await openHeaderCommandMenu(page);
await page.locator("#settingsButton").click();
await expect(page.locator("#adminDialog")).toBeVisible();
await shot("admin-1600-day");
await page.locator("#closeAdminDialog").click();
await page.locator("#themeToggle").click();
await expect(page.locator("html")).toHaveAttribute("data-theme", "dark");
await page.locator('[data-view="screenerView"]').first().click();
expect(await overflowX()).toBeLessThanOrEqual(1);
await shot("screener-1600-night");
await page.locator('[data-view="reviewWorkspaceView"]').first().click();
expect(await overflowX()).toBeLessThanOrEqual(1);
await shot("review-1600-night");
await page.setViewportSize({ width: 1280, height: 800 });
await page.locator('[data-view="screenerView"]').first().click();
expect(await overflowX()).toBeLessThanOrEqual(1);
await shot("screener-1280-night");
await page.locator('[data-view="reviewWorkspaceView"]').first().click();
expect(await overflowX()).toBeLessThanOrEqual(1);
await shot("review-1280-night");
await page.locator("#themeToggle").click();
await expect(page.locator("html")).toHaveAttribute("data-theme", "light");
await page.locator('[data-view="screenerView"]').first().click();
expect(await overflowX()).toBeLessThanOrEqual(1);
await shot("screener-1280-day");
await page.locator('[data-view="reviewWorkspaceView"]').first().click();
expect(await overflowX()).toBeLessThanOrEqual(1);
await shot("review-1280-day");
await page.locator('[data-view="screenerView"]').first().click();
await page.setViewportSize({ width: 390, height: 844 });
await expect(page.locator("#screenerView")).toHaveClass(/active-view/);
expect(await overflowX()).toBeLessThanOrEqual(1);
await shot("screener-390-day");
await page.locator(".mobile-primary-tab[data-view=\"reviewWorkspaceView\"]").click();
await expect(page.locator("#reviewWorkspaceView")).toHaveClass(/active-view/);
expect(await overflowX()).toBeLessThanOrEqual(1);
await shot("review-390-day");
expect(pageErrors).toEqual([]);
});