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

chore: create Multica handoff checkpoint

Browse Source
This commit is contained in:
leefer
2026-08-06 22:54:46 +08:00
parent bd97ba1829
commit 33f9db43b1
51 changed files with 3054 additions and 2883 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/frontend/index.html
+35 -24
View File
@@ -17,29 +17,29 @@
document.documentElement.style.colorScheme = theme;
})();
</script>
<link rel="stylesheet" href="/shared/tokens.css?v=20260729-1">
<link rel="stylesheet" href="/shared/base.css?v=20260802-5">
<link rel="stylesheet" href="/shared/shell.css?v=20260802-5">
<link rel="stylesheet" href="/shared/auth.css?v=20260802-5">
<link rel="stylesheet" href="/shared/components/controls.css?v=20260802-5">
<link rel="stylesheet" href="/shared/components/navigation.css?v=20260802-5">
<link rel="stylesheet" href="/shared/components/cards.css?v=20260802-5">
<link rel="stylesheet" href="/shared/components/tables.css?v=20260802-5">
<link rel="stylesheet" href="/shared/components/dialogs.css?v=20260802-5">
<link rel="stylesheet" href="/shared/components/feedback.css?v=20260802-5">
<link rel="stylesheet" href="/pages/market/foundation.css?v=20260802-5">
<link rel="stylesheet" href="/pages/sentiment/foundation.css?v=20260802-5">
<link rel="stylesheet" href="/pages/pools/foundation.css?v=20260802-5">
<link rel="stylesheet" href="/pages/ladder/foundation.css?v=20260802-5">
<link rel="stylesheet" href="/pages/rotation/foundation.css?v=20260802-5">
<link rel="stylesheet" href="/pages/auction/foundation.css?v=20260802-5">
<link rel="stylesheet" href="/pages/themes/foundation.css?v=20260802-5">
<link rel="stylesheet" href="/pages/popularity/foundation.css?v=20260802-5">
<link rel="stylesheet" href="/pages/dragon-tiger/foundation.css?v=20260802-5">
<link rel="stylesheet" href="/pages/screener/foundation.css?v=20260804-1">
<link rel="stylesheet" href="/pages/mentor/foundation.css?v=20260802-5">
<link rel="stylesheet" href="/pages/heaven/foundation.css?v=20260804-3">
<link rel="stylesheet" href="/pages/review/foundation.css?v=20260802-5">
<link rel="stylesheet" href="/shared/tokens.css?v=20260806-2">
<link rel="stylesheet" href="/shared/base.css?v=20260806-1">
<link rel="stylesheet" href="/shared/shell.css?v=20260806-2">
<link rel="stylesheet" href="/shared/auth.css?v=20260806-1">
<link rel="stylesheet" href="/shared/components/controls.css?v=20260806-1">
<link rel="stylesheet" href="/shared/components/navigation.css?v=20260806-1">
<link rel="stylesheet" href="/shared/components/cards.css?v=20260806-1">
<link rel="stylesheet" href="/shared/components/tables.css?v=20260806-1">
<link rel="stylesheet" href="/shared/components/dialogs.css?v=20260806-1">
<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=20260806-2">
<link rel="stylesheet" href="/pages/pools/foundation.css?v=20260806-2">
<link rel="stylesheet" href="/pages/ladder/foundation.css?v=20260806-1">
<link rel="stylesheet" href="/pages/rotation/foundation.css?v=20260806-1">
<link rel="stylesheet" href="/pages/auction/foundation.css?v=20260806-2">
<link rel="stylesheet" href="/pages/themes/foundation.css?v=20260806-1">
<link rel="stylesheet" href="/pages/popularity/foundation.css?v=20260806-1">
<link rel="stylesheet" href="/pages/dragon-tiger/foundation.css?v=20260806-1">
<link rel="stylesheet" href="/pages/screener/foundation.css?v=20260806-2">
<link rel="stylesheet" href="/pages/mentor/foundation.css?v=20260806-2">
<link rel="stylesheet" href="/pages/heaven/foundation.css?v=20260806-2">
<link rel="stylesheet" href="/pages/review/foundation.css?v=20260806-1">
</head>
<body>
<section id="authGate" class="auth-gate" aria-label="账号登录">
@@ -64,6 +64,10 @@
<div class="main">
<header class="app-header">
<div class="mobile-page-context" aria-live="polite">
<span id="mobilePageGroup">行情</span>
<strong id="mobilePageTitle">情绪周期</strong>
</div>
<div class="market-tape" aria-label="市场概况">
<span class="market-item up">上涨 <strong id="tapeUp">--</strong></span>
<span class="market-item down">下跌 <strong id="tapeDown">--</strong></span>
@@ -83,6 +87,12 @@
<button id="assistantButton" class="icon-button assistant-button" type="button" title="复盘助手" aria-label="复盘助手"><i data-lucide="message-circle-more"></i></button>
<button id="headerMenuButton" class="icon-button header-menu-button" type="button" title="打开命令菜单" aria-label="打开命令菜单" aria-expanded="false" aria-controls="headerCommandGroup"><i data-lucide="ellipsis"></i></button>
<div id="headerCommandGroup" class="header-command-group">
<div class="mobile-command-shortcuts" aria-label="快捷工具">
<button class="button mobile-command-shortcut" type="button" data-mobile-command-target="globalSearchButton"><i data-lucide="search"></i><span>搜索</span></button>
<button class="button mobile-command-shortcut" type="button" data-mobile-command-target="themeToggle"><i data-lucide="moon"></i><span>外观</span></button>
<button class="button mobile-command-shortcut" type="button" data-mobile-command-target="alertButton"><i data-lucide="bell"></i><span>提醒</span></button>
<button class="button mobile-command-shortcut" type="button" data-mobile-command-target="assistantButton"><i data-lucide="message-circle-more"></i><span>助手</span></button>
</div>
<button id="refreshButton" class="button command-button" type="button"><i data-lucide="refresh-cw"></i><span>刷新</span></button>
<button id="syncButton" class="button primary command-button" type="button" hidden><i data-lucide="cloud-download"></i><span>后台刷新</span></button>
<button id="settingsButton" class="button command-button" type="button" hidden><i data-lucide="settings-2"></i><span>系统管理</span></button>
@@ -105,6 +115,7 @@
</div>
</div>
</header>
<button id="mobileCommandBackdrop" class="mobile-command-backdrop" type="button" aria-label="关闭命令菜单" hidden></button>
<nav class="module-nav" aria-label="复盘模块">
<div class="sidebar-brand">
@@ -128,7 +139,7 @@
</div>
<div class="nav-group tool-nav-group">
<div class="nav-group-label">智能工具</div>
<button class="module-tab mobile-primary-tab" type="button" data-view="screenerView" title="智能选股"><i data-lucide="search-check"></i><span>智能选股</span></button>
<button class="module-tab mobile-primary-tab" type="button" data-view="screenerView" title="智能选股"><i data-lucide="search-check"></i><span class="nav-label-desktop">智能选股</span><span class="nav-label-mobile">选股</span></button>
<button class="module-tab mobile-primary-tab" type="button" data-view="mentorView" title="问师"><i data-lucide="messages-square"></i><span>问师</span></button>
<button class="module-tab mobile-primary-tab" type="button" data-view="heavenView" title="问天"><i data-lucide="sparkles"></i><span>问天</span></button>
</div>
app/frontend/pages.config.js
+6 -6
View File
@@ -47,7 +47,7 @@
["heaven", "/pages/heaven/page.html?v=20260803-1", ["heavenView"]],
["ladder", "/pages/ladder/page.html?v=20260803-1", ["ladderView"]],
["screener", "/pages/screener/page.html?v=20260804-1", ["screenerView", "screenerTrackingView"]],
["mentor", "/pages/mentor/page.html?v=20260803-1", ["mentorView"]],
["mentor", "/pages/mentor/page.html?v=20260806-2", ["mentorView"]],
["rotation", "/pages/rotation/page.html?v=20260803-1", ["rotationView"]],
["auction", "/pages/auction/page.html?v=20260803-1", ["auctionView"]],
["themes", "/pages/themes/page.html?v=20260803-1", ["themeLibraryView"]],
@@ -71,7 +71,7 @@
"/pages/market/charts.js?v=20260803-1",
"/pages/market/entity-detail.js?v=20260803-1",
"/pages/market/stock-detail.js?v=20260803-1",
"/pages/market/preview.js?v=20260803-1",
"/pages/market/preview.js?v=20260806-1",
"/pages/market/search.js?v=20260803-1",
"/pages/market/bindings.js?v=20260803-1",
"/pages/ladder/page.js?v=20260729-1",
@@ -79,14 +79,14 @@
"/pages/auction/page.js?v=20260729-1",
"/pages/themes/page.js?v=20260729-1",
"/pages/popularity/page.js?v=20260729-1",
"/pages/dragon-tiger/page.js?v=20260729-1",
"/pages/screener/page.js?v=20260804-1",
"/pages/mentor/page.js?v=20260729-1",
"/pages/dragon-tiger/page.js?v=20260806-1",
"/pages/screener/page.js?v=20260806-1",
"/pages/mentor/page.js?v=20260806-2",
"/pages/heaven/page.js?v=20260729-1",
"/pages/review/page.js?v=20260729-1",
"/shared/state.js?v=20260729-1",
"/shared/api.js?v=20260729-1",
"/shared/shell.js?v=20260729-1",
"/shared/shell.js?v=20260806-1",
"/shared/export.js?v=20260731-1",
"/pages/heaven/loading-v2.js?v=20260728-2",
"/shared/context.js?v=20260804-1",
app/frontend/pages/auction/foundation.css
Vendored
+101 -9
View File
@@ -5,8 +5,8 @@
font-weight: 800;
}
@media (max-width: 720px) {
#auctionView {
@media (max-width: 767px) {
body.mobile-shell #auctionView {
border-radius: 0px;
}
}
@@ -287,7 +287,7 @@
max-width: 155px;
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.auction-phase-notice time {
grid-column: 2;
}
@@ -506,7 +506,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.auction-phase-notice {
grid-template-columns: 10px minmax(0px, 1fr);
@@ -1962,7 +1962,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.redesigned-auction-view {
padding: 0px;
}
@@ -2080,7 +2080,7 @@
}
}
@media (min-width: 721px) {
@media (min-width: 768px) {
body[data-active-view="auctionView"] .app-main {
display: flex;
@@ -2104,7 +2104,7 @@
}
}
@media (min-width: 721px) and (max-height: 900px) {
@media (min-width: 768px) and (max-height: 900px) {
.redesigned-auction-view {
padding: 10px 0 12px;
}
@@ -2196,7 +2196,7 @@
padding-right: 0px;
}
@media (min-width: 721px) {
@media (min-width: 768px) {
#auctionView .auction-page-head-v2 {
flex: 0 0 auto;
}
@@ -2242,7 +2242,7 @@
}
}
@media (max-width: 720px), (max-width: 1023px) and (max-height: 600px) {
@media (max-width: 767px), (max-width: 1023px) and (max-height: 600px) {
#auctionView .auction-workspace-v2 {
display: block;
}
@@ -2315,3 +2315,95 @@
color: var(--text-secondary);
}
/* Mobile auction keeps one page scrollbar; dense rows scroll only sideways. */
@media (max-width: 767px) {
#auctionView {
padding-inline: 0;
}
#auctionView .auction-workspace-v2 {
min-height: 0;
display: flex;
flex-direction: column;
gap: var(--space-12);
overflow: visible;
}
#auctionView .auction-primary-card {
width: 100%;
max-width: 100%;
min-height: 0;
min-width: 0;
overflow: visible;
}
#auctionView .auction-tabs-v2 {
width: 100%;
max-width: 100%;
min-width: 0;
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
padding-inline: 0;
overflow: visible;
}
#auctionView .auction-tabs-v2 button {
min-width: 0;
min-height: var(--mobile-touch-size);
justify-content: center;
padding-inline: var(--space-4);
font-size: var(--font-size-label);
}
#auctionView .auction-tabs-v2 .auction-summary-v2 {
width: 100%;
min-width: 0;
grid-column: 1 / -1;
grid-template-columns: repeat(2, minmax(0, 1fr));
margin-left: 0;
border-top: 1px solid var(--border-subtle);
border-left: 0;
}
#auctionView .auction-tools-v2,
#auctionView .auction-expectation-v2,
#auctionView .auction-tool-actions {
width: 100%;
max-width: 100%;
min-width: 0;
}
#auctionView .auction-filter-segments {
width: 100%;
min-width: 0;
}
#auctionView .auction-filter-segments button {
min-width: 0;
flex: 1 1 0;
}
#auctionView .auction-search-v2,
#auctionView .auction-search-v2 input {
min-width: 0;
}
#auctionView .auction-table-frame-v2 {
width: 100%;
max-width: 100%;
min-height: var(--mobile-table-min-height);
max-height: none;
min-width: 0;
overflow-x: auto;
overflow-y: visible;
}
#auctionView .auction-side-v2 {
max-height: none;
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: var(--space-12);
overflow: visible;
}
}
app/frontend/pages/dragon-tiger/foundation.css
Vendored
+36 -9
View File
@@ -661,7 +661,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
:where(#dragonView) .dragon-trader-list {
padding: 0px 15px;
}
@@ -842,7 +842,7 @@
padding: 9px 14px;
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.dragon-filterbar {
align-items: stretch;
@@ -1558,7 +1558,7 @@
height: 15px;
}
@media (min-width: 721px) {
@media (min-width: 768px) {
body[data-active-view="dragonView"] .app-main {
height: var(--workspace-height);
@@ -1576,7 +1576,7 @@
}
}
@media (min-width: 721px) and (max-height: 900px) {
@media (min-width: 768px) and (max-height: 900px) {
.redesigned-dragon-view {
padding-top: 9px;
@@ -1688,7 +1688,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.redesigned-dragon-view {
padding: 10px;
}
@@ -1795,7 +1795,7 @@
flex-direction: column;
}
#dragonView .dragon-trader-detail .trader-operations {
body.mobile-shell #dragonView .dragon-trader-detail .trader-operations {
overflow-x: auto;
}
@@ -2306,13 +2306,13 @@
font-weight: var(--dragon-profile-weight-semibold);
}
@media (min-width: 721px) {
@media (min-width: 768px) {
body[data-active-view="dragonView"] .hot-money-profiles-v2 {
flex: 1 1 auto;
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.hot-money-profiles-v2 {
overflow: visible;
}
@@ -2354,7 +2354,7 @@
}
}
@media (min-width: 721px) {
@media (min-width: 768px) {
body[data-active-view="dragonView"] .dragon-daily-content-v2 {
display: block;
@@ -2473,3 +2473,30 @@ table.tbl {
background: var(--surface-muted) !important;
}
/* Mobile dragon-tiger pages use document scrolling, including long operation lists. */
@media (max-width: 767px) {
#dragonView {
padding-inline: 0;
}
#dragonView :is(.dragon-daily-content-v2, .dragon-trader-detail-v2, .dragon-unclassified-v2, .hot-money-profiles-v2) {
max-height: none;
overflow: visible;
}
#dragonView .dragon-trader-detail .trader-operations {
max-height: none;
overflow-x: auto;
overflow-y: visible;
}
#dragonView .hot-money-profile-list-v2 {
max-height: none;
overflow: visible;
}
#dragonView .dragon-operation-table {
min-width: var(--table-wide);
}
}
app/frontend/pages/dragon-tiger/page.js
+1 -1
View File
@@ -261,7 +261,7 @@ function layoutDragonCards(container = document.querySelector("#dragonTraderList
const cards = [...container.querySelectorAll(".dragon-trader-card")];
const hitZones = [...container.querySelectorAll(".dragon-card-hit-zone")];
if (!cards.length) return;
const compact = window.innerWidth <= 720;
const compact = window.innerWidth <= 767;
const cardWidth = compact ? 148 : 176;
const available = Math.max(cardWidth, container.clientWidth - (compact ? 30 : 72));
const spread = Math.min(available - cardWidth, compact ? 310 : 1050);
app/frontend/pages/heaven/foundation.css
Vendored
+20 -7
View File
@@ -81,7 +81,7 @@ body[data-active-view="heavenView"] .workspace-view {
margin-top: 0px;
}
@media (max-width: 720px) {
@media (max-width: 767px) {
body[data-active-view="heavenView"] .workspace-view {
margin-top: 0px;
@@ -1440,7 +1440,7 @@ body[data-active-view="heavenView"] .workspace-view {
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
body[data-active-view="heavenView"] .overview-strip {
display: none;
}
@@ -5738,7 +5738,7 @@ body[data-active-view="heavenView"] .workspace-view {
margin-top: 12px;
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.heaven-calibration-heading {
align-items: flex-start;
@@ -6139,7 +6139,7 @@ body[data-active-view="heavenView"] .workspace-view {
border-top: 1px solid var(--border);
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.heart-toolbar-controls {
top: 8px;
@@ -6290,7 +6290,7 @@ body[data-active-view="heavenView"] .workspace-view {
min-height: 340px;
}
@media (max-width: 720px) {
@media (max-width: 767px) {
#heavenView .heaven-toolbar {
min-height: 62px;
@@ -6653,7 +6653,7 @@ body[data-active-view="heavenView"] .workspace-view {
--wt-history-bg: #fbfaf6;
}
@media (min-width: 721px) {
@media (min-width: 768px) {
:root[data-theme="light"] body[data-active-view="heavenView"] {
--wt-bg: #f4f5f7;
}
@@ -9236,7 +9236,7 @@ body[data-active-view="heavenView"] .workspace-view {
}
}
@media (min-width: 721px) {
@media (min-width: 768px) {
body[data-active-view="heavenView"] {
--wt-bg: #0b1120;
}
@@ -11719,3 +11719,16 @@ body[data-active-view="heavenView"] .workspace-view {
width: min(100% - 40px, 1280px);
}
}
@media (max-width: 767px) {
:root[data-theme="dark"] body.mobile-shell[data-active-view="heavenView"] .app-main,
:root[data-theme="dark"] body.mobile-shell[data-active-view="heavenView"] #heavenView.heaven-shell {
background-color: var(--wt-bg);
background-image: var(--wt-stage-bg);
color: var(--wt-text);
}
:root[data-theme="dark"] body.mobile-shell[data-active-view="heavenView"] #heavenView .heaven-panel {
background: transparent;
}
}
app/frontend/pages/ladder/foundation.css
Vendored
+99 -4
View File
@@ -66,7 +66,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.ladder-more {
grid-column: auto;
@@ -81,7 +81,7 @@
box-shadow: rgba(22, 34, 46, 0.04) 0px 1px 3px;
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.ladder-board {
align-items: stretch;
@@ -1015,7 +1015,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.redesigned-ladder-view {
padding: 0px;
}
@@ -1097,7 +1097,7 @@
}
}
@media (min-width: 721px) {
@media (min-width: 768px) {
:root #ladderView.active-view {
height: auto;
@@ -1170,3 +1170,98 @@
color: var(--text-secondary);
}
/* Mobile ladder becomes a readable vertical hierarchy instead of a narrow rail. */
@media (max-width: 767px) {
#ladderView {
padding-inline: 0;
}
#ladderView .ladder-page-head {
gap: var(--space-8);
}
#ladderView .ladder-head-actions {
width: 100%;
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: var(--space-8);
}
#ladderView .ladder-sort-segment {
min-width: 0;
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
#ladderView .market-ladder-workspace,
#ladderView .lad-grid {
display: flex;
flex-direction: column;
gap: var(--space-12);
}
#ladderView .market-ladder-board {
width: 100%;
display: flex;
flex-direction: column;
}
#ladderView .market-ladder-tier {
width: 100%;
min-height: 0;
display: block;
}
#ladderView .market-ladder-label {
width: 100%;
min-height: var(--mobile-touch-size);
display: flex;
align-items: center;
gap: var(--space-8);
padding: var(--space-8) var(--space-12);
border-right: 0;
border-bottom: 1px solid var(--border-subtle);
writing-mode: horizontal-tb;
}
#ladderView .market-ladder-level {
display: inline-flex;
margin: 0;
writing-mode: horizontal-tb;
}
#ladderView .market-ladder-rate {
display: inline-flex;
writing-mode: horizontal-tb;
margin-left: auto;
}
#ladderView .market-ladder-stocks {
width: 100%;
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: var(--space-8);
padding: var(--space-8);
}
#ladderView .market-ladder-stock {
width: 100%;
min-width: 0;
}
#ladderView .market-ladder-gap-note,
#ladderView .market-ladder-more {
width: 100%;
min-height: var(--mobile-touch-size);
margin: 0;
justify-content: center;
}
#ladderView .market-ladder-insights {
width: 100%;
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: var(--space-12);
}
}
app/frontend/pages/market/foundation.css
Vendored
+3 -3
View File
@@ -1,5 +1,5 @@
/* Canonical CSS owner: market. Historical layers consolidated 2026-08-02. */
@media (max-width: 720px) {
@media (max-width: 767px) {
.stock-dialog {
width: calc(-16px + 100vw);
@@ -628,7 +628,7 @@
height: 14px;
}
@media (max-width: 720px) {
@media (max-width: 767px) {
body.stock-preview-open {
overflow: hidden;
}
@@ -770,7 +770,7 @@
overflow-wrap: anywhere;
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.entity-detail-dialog .detail-grid {
grid-template-columns: repeat(2, minmax(0px, 1fr));
}
app/frontend/pages/market/preview.js
+6 -6
View File
@@ -96,7 +96,7 @@ function findStockFallback(code) {
function supportsStockPreviewHover() {
return window.matchMedia("(hover: hover) and (pointer: fine)").matches
&& window.innerWidth > 720;
&& window.innerWidth > 767;
}
function handleStockPreviewPointerOver(event) {
@@ -138,7 +138,7 @@ function handleStockPreviewFocusOut(event) {
}
function handleMobileStockPreviewClick(event) {
if (window.innerWidth > 720) return;
if (window.innerWidth > 767) return;
const trigger = event.target.closest?.(".stock-preview-trigger");
if (!trigger) return;
const code = stockCodeFromTrigger(trigger);
@@ -160,7 +160,7 @@ function handleStockPreviewKeydown(event) {
const code = stockCodeFromTrigger(trigger);
if (!code) return;
event.preventDefault();
if (window.innerWidth <= 720) showStockPreview(code, trigger);
if (window.innerWidth <= 767) showStockPreview(code, trigger);
else openStock(code, findStockFallback(code));
}
@@ -186,7 +186,7 @@ async function showStockPreview(code, trigger) {
state.stockPreviewChart = "daily";
renderStockPreviewLoading();
elements.stockPreview.hidden = false;
const mobile = window.innerWidth <= 720;
const mobile = window.innerWidth <= 767;
elements.stockPreviewBackdrop.hidden = !mobile;
document.body.classList.toggle("stock-preview-open", mobile);
requestAnimationFrame(repositionStockPreview);
@@ -239,7 +239,7 @@ async function showEntityPreview(item, trigger) {
state.stockPreviewChart = "daily";
renderStockPreviewLoading();
elements.stockPreview.hidden = false;
const mobile = window.innerWidth <= 720;
const mobile = window.innerWidth <= 767;
elements.stockPreviewBackdrop.hidden = !mobile;
document.body.classList.toggle("stock-preview-open", mobile);
requestAnimationFrame(repositionStockPreview);
@@ -433,7 +433,7 @@ function openStockDetailFromPreview() {
}
function repositionStockPreview() {
if (elements.stockPreview.hidden || window.innerWidth <= 720 || !stockPreviewAnchor?.isConnected) return;
if (elements.stockPreview.hidden || window.innerWidth <= 767 || !stockPreviewAnchor?.isConnected) return;
const anchor = stockPreviewAnchor.getBoundingClientRect();
const preview = elements.stockPreview.getBoundingClientRect();
const gap = 12;
app/frontend/pages/mentor/foundation.css
Vendored
+677 -2490
View File
File diff suppressed because it is too large Load Diff
app/frontend/pages/mentor/page.html
+69 -52
View File
@@ -1,72 +1,89 @@
<section id="mentorView" class="workspace-view page member-feature-view redesigned-mentor-view">
<div class="member-gate" hidden><div class="member-gate-icon"><i data-lucide="lock-keyhole"></i></div><div><strong>问师仅对会员开放</strong><span>开通会员后可使用游资思维模型进行对话。会员状态可从顶部账号标识进入。</span></div></div>
<div class="member-gate" hidden><div class="member-gate-icon"><i data-lucide="lock-keyhole"></i></div><div><strong>问师仅对会员开放</strong><span>开通会员后可使用思维模型进行对话。会员状态可从顶部账号标识进入。</span></div></div>
<header class="section-toolbar lad-head mentor-page-header">
<div class="section-title-group mentor-page-title">
<h2>问师</h2>
<span class="section-subtitle">向思维模型请教 · <span id="mentorDataDate">--</span></span>
</div>
<div class="toolbar-controls mentor-page-controls">
<div class="mentor-evidence-filters seg" role="group" aria-label="按素材等级筛选">
<button class="active" type="button" data-mentor-grade="all">全部</button>
<button type="button" data-mentor-grade="A">A级</button>
<button type="button" data-mentor-grade="B">B级</button>
<button type="button" data-mentor-grade="C">C级</button>
</div>
<span class="section-subtitle">与不同交易思维模型持续对话 · <span id="mentorDataDate">--</span></span>
</div>
</header>
<div id="mentorNotice" class="inline-notice" hidden></div>
<div class="mentor-layout mentor-grid">
<aside class="mentor-sidebar mentor-library-card card">
<button id="mentorDirectoryToggle" class="mentor-directory-toggle" type="button" aria-expanded="false" aria-controls="mentorDirectoryContent">
<span><i data-lucide="users-round"></i><span><small>当前思维模型</small><strong id="mobileActiveMentorName">--</strong></span></span>
<i data-lucide="chevron-up"></i>
</button>
<div id="mentorDirectoryBackdrop" class="mentor-directory-backdrop" hidden></div>
<div id="mentorDirectoryContent" class="mentor-directory-content">
<div class="workspace-heading card-h mentor-directory-heading">
<div class="mentor-directory-title"><h3>模型库</h3><span>语料完整度决定回答质量</span></div>
<div class="mentor-directory-actions">
<strong id="mentorCount" class="mentor-count">0 位</strong>
<button id="mentorSortToggle" class="mentor-sort-toggle" type="button" aria-pressed="false" title="整理顺序"><i data-lucide="list-ordered"></i><span>整理</span></button>
<button id="closeMentorDirectory" class="icon-button mentor-directory-close" type="button" aria-label="关闭思维模型目录" title="关闭"><i data-lucide="x"></i></button>
</div>
</div>
<div class="mentor-layout">
<aside class="mentor-sidebar" aria-label="思维模型目录">
<div class="mentor-directory-heading">
<div class="mentor-directory-title"><strong>联系人</strong><span id="mentorCount">0 位</span></div>
<button id="mentorSortToggle" class="mentor-sort-toggle" type="button" aria-pressed="false" title="整理联系人顺序"><i data-lucide="list-ordered"></i><span>整理</span></button>
</div>
<div class="mentor-directory-tools">
<label class="mentor-search-field">
<span class="visually-hidden">搜索思维模型</span>
<i data-lucide="search"></i>
<input id="mentorSearchInput" type="search" maxlength="50" placeholder="搜索姓名、模式或标签" autocomplete="off">
<input id="mentorSearchInput" type="search" maxlength="50" placeholder="搜索联系人或标签" autocomplete="off">
</label>
<p id="mentorSortHint" class="mentor-sort-hint" hidden>拖动卡片，或使用箭头调整顺序</p>
<div id="mentorList" class="mentor-list"></div>
<div id="mentorListEmpty" class="mentor-list-empty" hidden>没有符合条件的思维模型</div>
<p class="mentor-evidence-legend">素材等级反映蒸馏依据，不代表人物能力或收益水平。</p>
</div>
</aside>
<section class="mentor-chat-panel card">
<header class="mentor-chat-header card-h">
<div class="mentor-active-profile">
<div class="mentor-active-title"><h3 id="activeMentorName">--</h3><span id="activeMentorBadges" class="mentor-active-badges"></span></div>
<p id="activeMentorEvidence">--</p>
<div id="activeMentorFocus" class="mentor-active-focus"></div>
<div class="mentor-evidence-filters" role="group" aria-label="按素材等级筛选">
<button class="active" type="button" data-mentor-grade="all">全部</button>
<button type="button" data-mentor-grade="A">A级</button>
<button type="button" data-mentor-grade="B">B级</button>
<button type="button" data-mentor-grade="C">C级</button>
</div>
<button id="clearMentorChatButton" class="button ghost mentor-clear-button" type="button" disabled><i data-lucide="trash-2"></i><span>清空对话</span></button>
</header>
<div class="chat-box">
<div id="mentorMessages" class="mentor-messages chat-log" aria-live="polite"></div>
<div id="mentorQuickPrompts" class="mentor-quick-prompts">
<span class="mentor-prompt-label">试着这样问</span>
<button type="button" data-mentor-prompt="怎么看今天的市场环境？">市场环境</button>
<button type="button" data-mentor-prompt="当前的市场主线和情绪周期是什么？">主线与周期</button>
<button type="button" data-mentor-prompt="如果今天是空仓状态，你会怎么制定操作预案？">空仓预案</button>
<button type="button" data-mentor-prompt="现在最需要防范的风险是什么？">风险检查</button>
<p id="mentorSortHint" class="mentor-sort-hint" hidden>拖动联系人，或使用箭头调整顺序</p>
</div>
<form id="mentorChatForm" class="mentor-chat-form chat-input">
<div id="mentorList" class="mentor-list"></div>
<div id="mentorListEmpty" class="mentor-list-empty" hidden>没有符合条件的思维模型</div>
<p class="mentor-evidence-legend">等级仅表示公开素材完整度</p>
</aside>
<section class="mentor-chat-panel" aria-label="问师对话">
<header class="mentor-chat-header">
<div class="mentor-chat-identity">
<span id="activeMentorAvatar" class="mentor-avatar" aria-hidden="true">师</span>
<div>
<div class="mentor-active-title"><h3 id="activeMentorName">--</h3><span id="activeMentorBadges" class="mentor-active-badges"></span></div>
<p id="activeMentorStatus">思维模型已就绪</p>
</div>
</div>
<button id="clearMentorChatButton" class="icon-button mentor-clear-button" type="button" disabled aria-label="清空当前对话" title="清空对话"><i data-lucide="trash-2"></i></button>
</header>
<div id="mentorMessages" class="mentor-messages" aria-live="polite"></div>
<div id="mentorQuickPrompts" class="mentor-quick-prompts">
<span class="mentor-prompt-label">开始一个话题</span>
<button type="button" data-mentor-prompt="怎么看今天的市场环境？"><i data-lucide="activity"></i>市场环境</button>
<button type="button" data-mentor-prompt="当前的市场主线和情绪周期是什么？"><i data-lucide="route"></i>主线与周期</button>
<button type="button" data-mentor-prompt="如果今天是空仓状态，你会怎么制定操作预案？"><i data-lucide="notebook-tabs"></i>空仓预案</button>
<button type="button" data-mentor-prompt="现在最需要防范的风险是什么？"><i data-lucide="shield-alert"></i>风险检查</button>
</div>
<form id="mentorChatForm" class="mentor-chat-form">
<label class="visually-hidden" for="mentorQuestion">向当前思维模型提问</label>
<textarea id="mentorQuestion" maxlength="2000" placeholder="输入市场、板块、个股代码或交易问题"></textarea>
<button id="sendMentorQuestion" class="button primary" type="submit"><i data-lucide="send-horizontal"></i><span>发送</span></button>
<div class="mentor-composer-actions">
<span>Enter 发送 · Shift + Enter 换行</span>
<button id="stopMentorQuestion" class="button ghost mentor-stop-button" type="button" hidden><i data-lucide="square"></i><span>停止</span></button>
<button id="sendMentorQuestion" class="button primary mentor-send-button" type="submit"><i data-lucide="send-horizontal"></i><span>发送</span></button>
</div>
</form>
<p class="mentor-disclaimer">基于公开资料提炼的思维模型模拟，不代表本人观点，不构成投资建议。</p>
</div>
</section>
<aside class="mentor-profile-panel" aria-label="当前思维模型资料">
<div class="mentor-profile-hero">
<span id="mentorProfileAvatar" class="mentor-profile-avatar" aria-hidden="true">师</span>
<h3 id="mentorProfileName">--</h3>
<p id="mentorProfileTagline">--</p>
<div id="mentorProfileBadges" class="mentor-profile-badges"></div>
</div>
<section class="mentor-profile-section">
<h4>关注维度</h4>
<div id="activeMentorFocus" class="mentor-active-focus"></div>
</section>
<section class="mentor-profile-section">
<h4>资料依据</h4>
<strong id="mentorProfileSource">--</strong>
<p id="activeMentorEvidence">--</p>
</section>
<section class="mentor-profile-section mentor-profile-boundary">
<h4>数据边界</h4>
<p><i data-lucide="calendar-days"></i><span id="mentorProfileDataDate">--</span></p>
<p><i data-lucide="database"></i><span>仅使用网页已提供的市场数据</span></p>
</section>
</aside>
</div>
</section>
app/frontend/pages/mentor/page.js
+75 -51
View File
@@ -37,8 +37,14 @@ function renderMentorWorkspace() {
const selected = setup.mentors.find((item) => item.id === state.selectedMentorId) || null;
setText("mentorDataDate", `数据日期 ${displayCompactDate(setup.trade_date)}`);
setText("activeMentorName", selected?.name || "--");
setText("mobileActiveMentorName", selected?.name || "选择思维模型");
setText("mentorProfileName", selected?.name || "--");
setText("mentorProfileTagline", selected?.tagline || selected?.description || "--");
setText("mentorProfileSource", selected?.evidence?.label || "公开资料整理");
setText("mentorProfileDataDate", `行情数据 ${displayCompactDate(setup.trade_date)}`);
setText("activeMentorAvatar", mentorAvatarText(selected));
setText("mentorProfileAvatar", mentorAvatarText(selected));
document.querySelector("#activeMentorBadges").innerHTML = selected ? renderMentorBadges(selected, true) : "";
document.querySelector("#mentorProfileBadges").innerHTML = selected ? renderMentorBadges(selected, true) : "";
setText("activeMentorEvidence", selected?.evidence?.note || selected?.description || "--");
document.querySelector("#activeMentorFocus").innerHTML = (selected?.focus || []).slice(0, 4)
.map((item) => `<span>${escapeHtml(item)}</span>`).join("");
@@ -82,16 +88,14 @@ function renderMentorDirectory() {
<article class="mentor-option ${mentor.id === state.selectedMentorId ? "active" : ""} ${mentor.pinned ? "is-pinned" : ""}"
data-mentor-card="${escapeHtml(mentor.id)}" draggable="${state.mentorSortMode && !state.mentorSavingPreferences}">
<button type="button" class="mentor-option-main" data-mentor-id="${escapeHtml(mentor.id)}" aria-pressed="${mentor.id === state.selectedMentorId}" ${state.mentorLoading ? "disabled" : ""}>
<span class="mentor-avatar" data-grade="${escapeHtml(String(mentor.evidence?.grade || "").toLowerCase())}" aria-hidden="true">${escapeHtml(mentorAvatarText(mentor))}</span>
<span class="mentor-option-copy">
<span class="mentor-option-heading">
<strong>${escapeHtml(mentor.name)}</strong>
<span class="mentor-option-badges">${renderMentorBadges(mentor)}</span>
</span>
<em title="${escapeHtml(mentor.description || "")}">${escapeHtml(mentor.description || mentor.tagline || "思维模型")}</em>
<span class="mentor-option-meta">
${mentor.evidence?.label ? `<span class="mentor-evidence-source" title="${escapeHtml(mentor.evidence?.note || "素材说明")}">${escapeHtml(mentor.evidence.label)}</span>` : ""}
${(mentor.focus || []).slice(0, 2).map((item) => `<span>#${escapeHtml(item)}</span>`).join("")}
</span>
<span class="mentor-option-meta">${escapeHtml((mentor.focus || [])[0] || mentor.evidence?.label || "公开资料模型")}</span>
</span>
</button>
<span class="mentor-option-tools">
@@ -254,29 +258,16 @@ function renderMentorBadges(mentor, expanded = false) {
return badges.join("");
}
function toggleMentorDirectory(open) {
const mobileOpen = Boolean(open) && window.innerWidth <= 720;
state.mentorDirectoryOpen = mobileOpen;
const sidebar = document.querySelector("#mentorView .mentor-sidebar");
const backdrop = document.querySelector("#mentorDirectoryBackdrop");
const toggle = document.querySelector("#mentorDirectoryToggle");
sidebar.classList.toggle("is-open", mobileOpen);
backdrop.hidden = !mobileOpen;
toggle.setAttribute("aria-expanded", String(mobileOpen));
document.body.classList.toggle("mentor-directory-open", mobileOpen);
if (mobileOpen) requestAnimationFrame(() => document.querySelector("#mentorSearchInput").focus());
function mentorAvatarText(mentor) {
return Array.from(String(mentor?.name || "师").trim())[0] || "师";
}
async function selectMentor(mentorId) {
if (mentorId === state.selectedMentorId) {
toggleMentorDirectory(false);
return;
}
if (mentorId === state.selectedMentorId) return;
state.selectedMentorId = mentorId;
state.mentorMessages = [];
hideMentorNotice();
renderMentorWorkspace();
toggleMentorDirectory(false);
state.mentorMessages = await loadMentorMessages();
renderMentorMessages();
}
@@ -289,35 +280,53 @@ function renderMentorMessages() {
<div class="mentor-empty-state">
<span class="mentor-empty-mark" aria-hidden="true"><i data-lucide="messages-square"></i></span>
<strong>向「${escapeHtml(selected?.name || "问师")}」请教</strong>
<p>${escapeHtml(selected?.tagline || selected?.description || "选择一个问题开始对话")}</p>
<p>${escapeHtml(selected?.tagline || selected?.description || "从一个具体问题开始对话")}</p>
</div>
`;
refreshIcons();
} else {
container.innerHTML = state.mentorMessages.map((message) => `
<article class="mentor-message ${message.role} ${message.error ? "is-error" : ""}">
<div class="mentor-message-label">${message.role === "user" ? "我" : escapeHtml(selected?.name || "问师")}</div>
<div class="mentor-message-content">${message.role === "assistant" ? formatMentorAnswer(message.content) : escapeHtml(message.content)}</div>
${message.streaming ? '<span class="assistant-stream-caret" aria-hidden="true"></span>' : ""}
${message.meta && !message.streaming ? `<small>${escapeHtml(message.meta)}</small>` : ""}
<span class="mentor-message-avatar" aria-hidden="true">${message.role === "user" ? "我" : escapeHtml(mentorAvatarText(selected))}</span>
<div class="mentor-message-body">
<div class="mentor-message-label">${message.role === "user" ? "我" : escapeHtml(selected?.name || "问师")}</div>
<div class="mentor-message-content">${message.role === "assistant"
? (message.content ? formatMentorAnswer(message.content) : '<p class="mentor-loading-copy">正在读取复盘数据并推演...</p>')
: escapeHtml(message.content)}</div>
${message.streaming ? '<span class="assistant-stream-caret" aria-hidden="true"></span>' : ""}
${renderMentorFollowUps(message)}
${message.meta && !message.streaming ? `<small>${escapeHtml(message.meta)}</small>` : ""}
</div>
</article>
`).join("");
if (state.mentorLoading && !state.mentorMessages.some((message) => message.streaming)) {
container.insertAdjacentHTML("beforeend", `
<article class="mentor-message assistant loading-message">
<div class="mentor-message-label">${escapeHtml(selected?.name || "问师")}</div>
<p>正在读取复盘数据并推演...</p>
</article>
`);
}
}
document.querySelector("#mentorQuickPrompts").hidden = state.mentorMessages.length > 0 || state.mentorLoading;
document.querySelector("#clearMentorChatButton").disabled = !state.mentorMessages.length || state.mentorLoading;
document.querySelector("#mentorQuestion").disabled = state.mentorLoading || !state.selectedMentorId;
document.querySelector("#sendMentorQuestion").disabled = state.mentorLoading || !state.selectedMentorId;
document.querySelector("#sendMentorQuestion").hidden = state.mentorLoading;
document.querySelector("#stopMentorQuestion").hidden = !state.mentorLoading;
document.querySelector("#mentorSortToggle").disabled = state.mentorLoading;
setText("activeMentorStatus", state.mentorLoading ? "正在生成回答..." : "思维模型已就绪");
container.querySelectorAll("[data-mentor-follow-up]").forEach((button) => {
button.addEventListener("click", () => useMentorQuickPrompt(button.dataset.mentorFollowUp));
});
refreshIcons();
requestAnimationFrame(() => { container.scrollTop = container.scrollHeight; });
}
function renderMentorFollowUps(message) {
if (message.role !== "assistant" || message.streaming || message.error || !Array.isArray(message.followUps)) return "";
const items = message.followUps.filter(Boolean).slice(0, 3);
if (items.length < 2) return "";
return `
<div class="mentor-follow-ups" aria-label="继续追问">
<span>继续追问</span>
${items.map((item) => `<button type="button" data-mentor-follow-up="${escapeHtml(item)}"><i data-lucide="corner-down-right"></i><span>${escapeHtml(item)}</span></button>`).join("")}
</div>
`;
}
async function sendMentorQuestion(event) {
event.preventDefault();
if (state.mentorLoading || !state.selectedMentorId) return;
@@ -328,8 +337,9 @@ async function sendMentorQuestion(event) {
role: item.role,
content: item.content.slice(0, 3500),
}));
state.mentorMessages.forEach((message) => { delete message.followUps; });
state.mentorMessages.push({ role: "user", content: question });
const responseMessage = { role: "assistant", content: "", streaming: true, meta: "" };
const responseMessage = { role: "assistant", content: "", streaming: true, meta: "", followUps: [] };
state.mentorMessages.push(responseMessage);
input.value = "";
state.mentorLoading = true;
@@ -353,6 +363,9 @@ async function sendMentorQuestion(event) {
},
(meta) => {
responseMessage.meta = `${displayCompactDate(meta.data_trade_date || elements.tradeDate.value)} · 回答完成`;
responseMessage.followUps = Array.isArray(meta.follow_ups)
? meta.follow_ups.filter((item) => typeof item === "string" && item.trim()).slice(0, 3)
: [];
if (meta.notice) showMentorNotice(meta.notice);
},
);
@@ -360,13 +373,23 @@ async function sendMentorQuestion(event) {
setStatus("问师回答完成");
} catch (error) {
responseMessage.streaming = false;
responseMessage.error = true;
if (!responseMessage.content) {
state.mentorMessages = state.mentorMessages.filter((item) => item !== responseMessage);
responseMessage.followUps = [];
if (state.mentorController?.signal.aborted) {
if (responseMessage.content) {
responseMessage.meta = "生成已停止";
} else {
state.mentorMessages = state.mentorMessages.filter((item) => item !== responseMessage);
}
setStatus("已停止问师回答");
} else {
responseMessage.error = true;
if (!responseMessage.content) {
state.mentorMessages = state.mentorMessages.filter((item) => item !== responseMessage);
}
showMentorNotice(error.message || "问师回答失败");
showToast(error.message || "问师回答失败");
setStatus("问师回答失败");
}
showMentorNotice(error.message || "问师回答失败");
showToast(error.message || "问师回答失败");
setStatus("问师回答失败");
} finally {
state.mentorLoading = false;
state.mentorController = null;
@@ -376,6 +399,12 @@ async function sendMentorQuestion(event) {
}
}
function stopMentorGeneration() {
if (!state.mentorLoading || !state.mentorController) return;
state.mentorController.abort();
setText("activeMentorStatus", "正在停止...");
}
let mentorRenderFrame = 0;
function scheduleMentorRender() {
@@ -497,12 +526,8 @@ function formatMentorInline(content) {
function bindMentorEvents() {
document.querySelector("#mentorChatForm").addEventListener("submit", sendMentorQuestion);
document.querySelector("#stopMentorQuestion").addEventListener("click", stopMentorGeneration);
document.querySelector("#clearMentorChatButton").addEventListener("click", clearMentorConversation);
document.querySelector("#mentorDirectoryToggle").addEventListener("click", () => {
toggleMentorDirectory(!state.mentorDirectoryOpen);
});
document.querySelector("#closeMentorDirectory").addEventListener("click", () => toggleMentorDirectory(false));
document.querySelector("#mentorDirectoryBackdrop").addEventListener("click", () => toggleMentorDirectory(false));
document.querySelector("#mentorSortToggle").addEventListener("click", toggleMentorSortMode);
document.querySelector("#mentorSearchInput").addEventListener("input", (event) => {
state.mentorQuery = event.target.value.trim().toLocaleLowerCase("zh-CN");
@@ -520,10 +545,9 @@ function bindMentorEvents() {
document.querySelectorAll("[data-mentor-prompt]").forEach((button) => {
button.addEventListener("click", () => useMentorQuickPrompt(button.dataset.mentorPrompt));
});
document.addEventListener("keydown", (event) => {
if (event.key === "Escape") toggleMentorDirectory(false);
});
window.addEventListener("resize", () => {
if (window.innerWidth > 720) toggleMentorDirectory(false);
document.querySelector("#mentorQuestion").addEventListener("keydown", (event) => {
if (event.key !== "Enter" || event.shiftKey || event.isComposing) return;
event.preventDefault();
document.querySelector("#mentorChatForm").requestSubmit();
});
}
app/frontend/pages/pools/foundation.css
Vendored
+83 -7
View File
@@ -584,7 +584,7 @@
border-bottom-color: var(--border);
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.main-grid {
display: block;
@@ -1146,7 +1146,7 @@
}
}
@media (max-width: 720px), (max-width: 1023px) and (max-height: 600px) {
@media (max-width: 767px), (max-width: 1023px) and (max-height: 600px) {
.pool-page-head .toolbar-controls {
flex-wrap: wrap;
}
@@ -1290,7 +1290,7 @@
line-height: 1.6;
}
@media (max-width: 720px), (max-width: 1023px) and (max-height: 600px) {
@media (max-width: 767px), (max-width: 1023px) and (max-height: 600px) {
.broken-page-head .toolbar-controls {
flex-wrap: nowrap;
}
@@ -2182,7 +2182,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.redesigned-performance-view .performance-cards {
grid-template-columns: repeat(2, minmax(0px, 1fr));
}
@@ -2211,7 +2211,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.redesigned-performance-view {
padding: 0px;
}
@@ -2284,7 +2284,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
:is(#limitTable, #brokenTable, #downTable, #yesterdayTable) .pool-reason-cell {
white-space: normal;
}
@@ -2374,7 +2374,7 @@
overflow: auto;
}
@media (min-width: 721px) {
@media (min-width: 768px) {
#yesterdayView.active-view {
min-height: 0px;
@@ -2489,3 +2489,79 @@
.ladder-mini.pool-side-list {
display: block;
}
/* Mobile pool workspaces keep filters usable and tables locally horizontal. */
@media (max-width: 767px) {
:is(#limitPool, #brokenView, #downView, #yesterdayView, #performanceView) {
padding-inline: 0;
}
:is(.pool-page-head, .broken-page-head, .down-page-head, .yesterday-page-head) {
gap: var(--space-8);
}
body.mobile-shell :is(.pool-page-head, .broken-page-head, .down-page-head, .yesterday-page-head) .toolbar-controls {
width: 100%;
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: var(--space-8);
overflow: visible;
}
.pool-page-head .pool-filter-segments {
width: 100%;
min-width: 0;
grid-column: 1 / -1;
}
.pool-page-head .pool-filter-segments .segment {
min-width: 0;
flex: 1 1 0;
padding-inline: var(--space-8);
}
:is(.pool-page-head, .broken-page-head, .down-page-head, .yesterday-page-head) .pool-search-field {
width: 100%;
min-width: 0;
}
:is(.pool-page-head, .broken-page-head, .down-page-head, .yesterday-page-head) .pool-search-field input {
width: 100%;
min-width: 0;
flex: 1 1 auto;
}
#limitPool .redesigned-pool-grid {
display: flex;
flex-direction: column;
gap: var(--space-12);
}
:is(#limitPool, #brokenView, #downView, #yesterdayView) .tbl-wrap {
min-height: var(--mobile-table-min-height);
max-height: none;
overflow-x: auto;
overflow-y: visible;
}
#limitPool .pool-insight-rail {
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: var(--space-12);
}
#limitPool .pool-insight-rail .rail-section {
min-height: 0;
}
#yesterdayView .yesterday-result-summary {
display: flex;
overflow-x: auto;
scrollbar-width: none;
}
#yesterdayView .yesterday-summary-cell {
min-width: var(--mobile-summary-card-width);
flex: 0 0 auto;
}
}
app/frontend/pages/popularity/foundation.css
Vendored
+17 -4
View File
@@ -602,7 +602,7 @@
color: var(--r2-amber);
}
@media (min-width: 721px) {
@media (min-width: 768px) {
body[data-active-view="popularityView"] .app-main {
display: flex;
@@ -626,7 +626,7 @@
}
}
@media (min-width: 721px) and (max-height: 900px) {
@media (min-width: 768px) and (max-height: 900px) {
.redesigned-popularity-view {
padding-top: 9px;
@@ -684,7 +684,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.redesigned-popularity-view {
padding: 10px;
}
@@ -869,7 +869,7 @@
width: var(--col-number);
}
@media (min-width: 721px) {
@media (min-width: 768px) {
#popularityView .popularity-glance-v2,
#popularityView .popularity-page-head-v2 {
flex: 0 0 auto;
@@ -919,3 +919,16 @@
box-shadow: var(--control-shadow);
}
@media (max-width: 767px) {
#popularityView {
padding-inline: 0;
}
#popularityView .popularity-table-frame-v2 {
min-height: var(--mobile-table-min-height);
max-height: none;
overflow-x: auto;
overflow-y: visible;
}
}
app/frontend/pages/review/foundation.css
Vendored
+42 -8
View File
@@ -109,7 +109,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.trade-log-dialog {
width: calc(-16px + 100vw);
@@ -154,7 +154,7 @@
border-bottom-color: var(--border);
}
@media (max-width: 720px) {
@media (max-width: 767px) {
:where(#reviewWorkspaceView) .workspace-section {
min-width: 0px;
@@ -207,7 +207,7 @@ body[data-active-view="reviewWorkspaceView"] .workspace-view {
border-top: 1px solid var(--border);
}
@media (max-width: 720px) {
@media (max-width: 767px) {
body[data-active-view="reviewWorkspaceView"] .workspace-view {
margin-top: 0px;
@@ -315,7 +315,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
color: var(--primary);
}
@media (max-width: 720px) {
@media (max-width: 767px) {
:where(#reviewWorkspaceView) .review-workspace {
display: block;
@@ -1058,7 +1058,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
#reviewWorkspaceView .note-row {
grid-template-columns: 1fr auto;
}
@@ -1091,7 +1091,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
#reviewWorkspaceView .review-page-header {
min-height: 68px;
@@ -1908,7 +1908,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
#reviewWorkspaceView .review-watchlist-table {
min-width: 760px;
}
@@ -2057,7 +2057,7 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
white-space: normal;
}
@media (min-width: 721px) {
@media (min-width: 768px) {
:root #reviewWorkspaceView.active-view {
height: auto;
@@ -2167,3 +2167,37 @@ body[data-active-view="reviewWorkspaceView"] .overview-strip {
:root[data-theme="dark"] #reviewWorkspaceView .data-table tbody td {
color: var(--text-primary);
}
/* Mobile review is a single vertical workflow with locally horizontal tables. */
@media (max-width: 767px) {
body.mobile-shell #reviewWorkspaceView {
padding-inline: 0;
}
body.mobile-shell #reviewWorkspaceView .review-workspace,
body.mobile-shell #reviewWorkspaceView .review-grid,
body.mobile-shell #reviewWorkspaceView .review-left-stack {
width: 100%;
height: auto;
display: flex;
flex-direction: column;
gap: var(--space-12);
}
body.mobile-shell #reviewWorkspaceView :is(.workspace-table-frame, .trade-log-table-frame) {
min-height: 0;
max-height: none;
overflow-x: auto;
overflow-y: visible;
}
body.mobile-shell #reviewWorkspaceView :is(.notes-history-section, .notes-history) {
max-height: none;
overflow: visible;
}
body.mobile-shell #reviewWorkspaceView .journal-section {
width: 100%;
height: auto;
}
}
app/frontend/pages/rotation/foundation.css
Vendored
+15 -4
View File
@@ -62,7 +62,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.rotation-history {
min-height: 224px;
}
@@ -991,7 +991,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.redesigned-rotation-view {
padding: 0px;
}
@@ -1087,7 +1087,7 @@
min-width: var(--table-wide);
}
@media (min-width: 721px) {
@media (min-width: 768px) {
#rotationView.active-view {
display: grid;
@@ -1157,7 +1157,7 @@
}
}
@media (max-width: 720px), (max-width: 1023px) and (max-height: 600px) {
@media (max-width: 767px), (max-width: 1023px) and (max-height: 600px) {
#rotationView.active-view {
display: block;
@@ -1245,3 +1245,14 @@
background: var(--surface-muted);
}
@media (max-width: 767px) {
#rotationView :is(.rotation-table-frame, .rotation-detail-card) {
max-height: none;
overflow-y: visible;
}
#rotationView .rotation-table-frame {
overflow-x: auto;
}
}
app/frontend/pages/screener/foundation.css
Vendored
+67 -11
View File
@@ -5,7 +5,7 @@
font-weight: 800;
}
@media (max-width: 720px) {
@media (max-width: 767px) {
#screenerView {
border-radius: 0px;
}
@@ -311,7 +311,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
#screenerView.mobile-results [data-screener-panel]:not([hidden]) {
display: block !important;
}
@@ -786,7 +786,7 @@
box-shadow: 1px 0 0 var(--border);
}
@media (max-width: 1023px) and (min-width: 721px) {
@media (max-width: 1023px) and (min-width: 768px) {
#screenerView .factor-data-status,
#screenerView .regime-evidence {
@@ -794,7 +794,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
body[data-active-view="screenerView"] .overview-strip {
display: none;
}
@@ -1114,7 +1114,7 @@
color: var(--market-down);
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.tracking-summary {
grid-template-columns: repeat(2, minmax(0px, 1fr));
}
@@ -1450,7 +1450,63 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
body.mobile-shell #screenerView .screener-stepper {
width: 100%;
display: flex;
padding-inline: var(--space-8);
overflow: visible;
}
body.mobile-shell #screenerView .screener-step {
min-width: 0;
flex: 1 1 0;
flex-direction: column;
justify-content: flex-start;
gap: var(--space-4);
text-align: center;
}
body.mobile-shell #screenerView .screener-step > div {
width: 100%;
min-width: 0;
}
body.mobile-shell #screenerView .screener-step :is(strong, small) {
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
body.mobile-shell #screenerView .step-line {
width: var(--space-8);
flex: 0 0 var(--space-8);
align-self: flex-start;
margin: var(--space-12) var(--space-4) 0;
}
}
@media (max-width: 767px) {
body.mobile-shell #screenerView,
body.mobile-shell #screenerTrackingView {
padding-inline: 0;
}
body.mobile-shell #screenerView :is(.screener-result-frame, .curated-strategy-list, .quant-builder-pane, .quant-summary-pane),
body.mobile-shell #screenerTrackingView .tracking-table-frame.tbl-wrap {
max-height: none;
overflow-y: visible;
}
body.mobile-shell #screenerView .screener-result-frame,
body.mobile-shell #screenerTrackingView .tracking-table-frame {
overflow-x: auto;
}
}
@media (max-width: 767px) {
.screener-page-heading {
min-height: 54px;
@@ -1673,7 +1729,7 @@
border-color: var(--border-strong);
}
@media (max-width: 720px) {
@media (max-width: 767px) {
#screenerView .screener-strategy-view {
padding: 8px;
}
@@ -2031,7 +2087,7 @@ body[data-active-view="screenerView"] .workspace-view {
min-height: 45px;
}
@media (min-width: 721px) and (max-width: 1279px) {
@media (min-width: 768px) and (max-width: 1279px) {
.quant-screener-panel {
grid-template-columns: 1fr;
}
@@ -2041,7 +2097,7 @@ body[data-active-view="screenerView"] .workspace-view {
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
body[data-active-view="screenerView"] .workspace-view {
margin-top: 0px;
@@ -2373,7 +2429,7 @@ body[data-active-view="screenerView"] .overview-strip {
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.screener-mode-tabs {
min-height: 50px;
@@ -6042,7 +6098,7 @@ body[data-active-view="screenerView"] .overview-strip {
min-width: var(--table-wide);
}
@media (min-width: 721px) {
@media (min-width: 768px) {
:root #screenerView.active-view {
height: auto;
app/frontend/pages/screener/page.js
+1 -1
View File
@@ -859,7 +859,7 @@ async function executeScreenerFormula({ mode, formula, strategyName, strategyId
renderScreenerResult();
if (executionMode === "smart") setText("screenerRunStatus", `完成 · ${payload.result.candidates.length} 只`);
updateBacktestTaskStatus();
if (window.innerWidth <= 720) selectScreenerMobileView("results");
if (window.innerWidth <= 767) selectScreenerMobileView("results");
setStatus(`${strategyName}完成 · ${payload.result.candidates.length} 只候选`);
} catch (error) {
showToast(error.message);
app/frontend/pages/sentiment/foundation.css
Vendored
+96 -10
View File
@@ -1,5 +1,5 @@
/* Canonical CSS owner: sentiment. Historical layers consolidated 2026-08-02. */
@media (max-width: 720px), (max-width: 1023px) and (max-height: 600px) {
@media (max-width: 767px), (max-width: 1023px) and (max-height: 600px) {
#sentimentCycleView {
--sentiment-history-max-height: min(480px, calc(100dvh - 210px));
}
@@ -428,7 +428,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
body[data-active-view="sentimentCycleView"] .overview-strip {
display: none;
}
@@ -541,7 +541,7 @@
background: rgb(238, 243, 246);
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.sentiment-block {
min-height: 0px;
@@ -619,7 +619,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.overview-strip .sentiment-block {
grid-area: 1 / 1 / 3;
@@ -1336,7 +1336,7 @@
}
}
@media (max-width: 1023px) and (min-width: 721px) {
@media (max-width: 1023px) and (min-width: 768px) {
.redesigned-emotion-grid {
grid-template-columns: 1fr;
}
@@ -1348,7 +1348,7 @@
}
}
@media (max-width: 720px), (max-width: 1023px) and (max-height: 600px) {
@media (max-width: 767px), (max-width: 1023px) and (max-height: 600px) {
.redesigned-emotion-grid {
grid-template-columns: 1fr;
}
@@ -1508,7 +1508,7 @@
text-align: center;
}
@media (min-width: 721px) {
@media (min-width: 768px) {
#sentimentCycleView.active-view {
min-height: 0px;
@@ -1534,7 +1534,7 @@
}
}
@media (min-width: 721px) and (max-height: 1100px) {
@media (min-width: 768px) and (max-height: 1100px) {
#sentimentCycleView .sentiment-phase-block {
gap: 12px;
@@ -1570,7 +1570,7 @@
}
}
@media (min-width: 721px) {
@media (min-width: 768px) {
:root #sentimentCycleView.active-view {
height: auto;
@@ -1661,7 +1661,7 @@
padding-bottom: var(--card-gap);
}
@media (min-width: 721px) {
@media (min-width: 768px) {
.redesigned-sentiment-view .sentiment-chart-shell {
padding-right: 16px;
@@ -1674,3 +1674,89 @@
grid-template-columns: minmax(270px, 1.25fr) repeat(3, minmax(160px, 1fr));
}
}
/* Mobile information order: trend, current phase, composition, then history. */
@media (max-width: 767px) {
#sentimentCycleView .sentiment-cycle-toolbar {
gap: var(--space-8);
padding: 0;
}
#sentimentCycleView .sentiment-cycle-analysis,
#sentimentCycleView .redesigned-emotion-grid {
display: flex;
flex-direction: column;
gap: var(--space-12);
}
#sentimentCycleView .sentiment-analysis-main {
order: 1;
}
#sentimentCycleView .sentiment-analysis-rail {
order: 2;
display: grid !important;
grid-template-columns: minmax(0, 1fr);
gap: var(--space-12);
}
#sentimentCycleView .sentiment-trend-panel,
#sentimentCycleView .sentiment-components-panel {
padding: 0;
}
#sentimentCycleView .sentiment-chart-legend {
gap: var(--space-12);
padding: 0 var(--space-12);
overflow-x: auto;
white-space: nowrap;
scrollbar-width: none;
}
#sentimentCycleView .sentiment-chart-shell,
#sentimentCycleView .sentiment-chart-shell canvas {
height: var(--mobile-chart-height);
}
#sentimentCycleView .sentiment-phase-block {
display: grid;
grid-template-columns: auto minmax(0, 1fr);
align-items: start;
gap: var(--space-12);
}
#sentimentCycleView .sentiment-current-phase-badge {
min-width: var(--mobile-phase-badge-width);
}
#sentimentCycleView .sentiment-detail-toolbar {
min-height: var(--mobile-touch-size);
padding: var(--space-8) 0;
}
#sentimentCycleView .sentiment-history-frame {
min-height: var(--mobile-table-min-height);
max-height: none;
margin-bottom: 0;
padding-bottom: 0;
overflow-x: auto;
overflow-y: visible;
}
}
@media (max-width: 359px) {
#sentimentCycleView .sentiment-phase-block {
grid-template-columns: minmax(0, 1fr);
}
}
@media (min-width: 768px) and (max-width: 1023px) {
#sentimentCycleView .redesigned-emotion-grid {
grid-template-columns: minmax(0, 1fr);
}
#sentimentCycleView .sentiment-analysis-rail {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
app/frontend/pages/themes/foundation.css
Vendored
+25 -7
View File
@@ -117,7 +117,7 @@
border-right: 0px;
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.theme-detail-empty {
min-height: 260px;
}
@@ -231,7 +231,7 @@
border-color: var(--border);
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.theme-directory {
max-height: 300px;
@@ -1100,7 +1100,7 @@
}
}
@media (min-width: 721px) and (max-width: 1180px) {
@media (min-width: 768px) and (max-width: 1180px) {
body[data-active-view="themeLibraryView"] .app-main {
overflow: hidden auto;
}
@@ -1128,7 +1128,7 @@
}
}
@media (min-width: 721px) and (max-height: 900px) {
@media (min-width: 768px) and (max-height: 900px) {
.redesigned-theme-view {
padding-top: 9px;
@@ -1192,7 +1192,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.redesigned-theme-view {
padding: 10px;
}
@@ -1404,7 +1404,7 @@
grid-template-columns: var(--right-rail-wide) minmax(0,1fr);
}
@media (min-width: 721px) {
@media (min-width: 768px) {
#themeLibraryView .theme-page-head-v2,
#themeLibraryView .theme-summary-v2 {
flex: 0 0 auto;
@@ -1452,7 +1452,7 @@
}
}
@media (max-width: 720px), (max-width: 1023px) and (max-height: 600px) {
@media (max-width: 767px), (max-width: 1023px) and (max-height: 600px) {
#themeLibraryView .theme-library-workspace-v2 {
height: auto;
@@ -1534,3 +1534,21 @@
transition: none;
}
}
@media (max-width: 767px) {
#themeLibraryView {
padding-inline: 0;
}
#themeLibraryView :is(.theme-directory-v2, .theme-detail-column-v2, .theme-detail-stack-v2) {
max-height: none;
overflow: visible;
}
#themeLibraryView .theme-members-frame-v2 {
min-height: var(--mobile-table-min-height);
max-height: none;
overflow-x: auto;
overflow-y: visible;
}
}
app/frontend/shared/auth.css
+5 -5
View File
@@ -479,13 +479,13 @@
white-space: nowrap;
}
@media (min-width: 721px) and (max-width: 1279px) {
@media (min-width: 768px) and (max-width: 1279px) {
.account-button {
width: 32px;
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.header-command-group .account-button {
width: 100%;
@@ -1020,7 +1020,7 @@ button.account-role-badge:focus-visible {
gap: 10px;
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.account-menu-shell {
width: 100%;
@@ -1128,7 +1128,7 @@ button.account-role-badge:focus-visible {
box-shadow: rgba(22, 34, 46, 0.15) 0px 14px 35px;
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.account-settings-dialog,
.settings-dialog {
width: calc(-16px + 100vw);
@@ -1648,7 +1648,7 @@ button.account-role-badge:focus-visible {
box-shadow: var(--shadow);
}
@media (min-width: 721px) {
@media (min-width: 768px) {
.account-menu-shell {
display: inline-flex;
}
app/frontend/shared/base.css
+27 -2
View File
@@ -125,13 +125,13 @@ dialog::backdrop {
backdrop-filter: blur(2px);
}
@media (min-width: 721px) {
@media (min-width: 768px) {
body {
overflow-y: hidden;
}
}
@media (max-width: 720px), (max-width: 1023px) and (max-height: 600px) {
@media (max-width: 767px), (max-width: 1023px) and (max-height: 600px) {
html {
width: 100%;
@@ -185,3 +185,28 @@ dialog::backdrop {
animation: auto ease 0s 1 normal none running none;
}
}
/* Mobile document contract: the page owns the only vertical scrollbar. */
@media (max-width: 767px) {
html {
width: 100%;
min-width: var(--mobile-min-width);
min-height: 100%;
height: auto;
overflow-x: hidden;
}
body.mobile-shell {
width: 100%;
min-width: var(--mobile-min-width);
min-height: 100%;
height: auto;
padding-bottom: var(--mobile-content-bottom);
overflow-y: auto;
overscroll-behavior-y: contain;
}
body.mobile-shell.mobile-command-open {
overflow: hidden;
}
}
app/frontend/shared/components/cards.css
+2 -2
View File
@@ -168,7 +168,7 @@
font-size: 11px;
}
@media (max-width: 720px), (max-width: 1023px) and (max-height: 600px) {
@media (max-width: 767px), (max-width: 1023px) and (max-height: 600px) {
.redesigned-page-head {
align-items: flex-start;
@@ -178,7 +178,7 @@
}
}
@media (min-width: 721px) {
@media (min-width: 768px) {
:is(.redesigned-auction-view, .redesigned-theme-view, .redesigned-popularity-view, .redesigned-dragon-view) {
width: min(100%, 2200px);
app/frontend/shared/components/controls.css
+87 -37
View File
@@ -9,7 +9,7 @@
stroke-width: 1.75;
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.header-command-group .command-button {
width: 100%;
@@ -106,7 +106,7 @@ body.sidebar-collapsed .sidebar-collapse-button .lucide {
transform: rotate(180deg);
}
@media (min-width: 721px) and (max-width: 1279px) {
@media (min-width: 768px) and (max-width: 1279px) {
.command-button {
width: 32px;
@@ -118,7 +118,7 @@ body.sidebar-collapsed .sidebar-collapse-button .lucide {
}
}
@media (min-width: 721px) and (max-width: 1023px) {
@media (min-width: 768px) and (max-width: 1023px) {
.sidebar-collapse-button span {
display: none;
}
@@ -132,7 +132,7 @@ body.sidebar-collapsed .sidebar-collapse-button .lucide {
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.header-command-group .button.primary {
border-color: var(--action);
@@ -186,7 +186,7 @@ body.sidebar-collapsed .sidebar-collapse-button .lucide {
height: 15px;
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.stock-heaven-button span {
display: none;
}
@@ -241,7 +241,7 @@ body.sidebar-collapsed .sidebar-collapse-button .lucide {
font-weight: 670;
}
@media (min-width: 721px) and (max-width: 1279px) {
@media (min-width: 768px) and (max-width: 1279px) {
.sidebar-collapse-button span {
display: none;
}
@@ -253,7 +253,7 @@ body.sidebar-collapsed .sidebar-collapse-button .lucide {
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.header-menu-button {
width: 34px;
@@ -593,7 +593,7 @@ body.sidebar-collapsed .sidebar-collapse-button .lucide {
box-shadow: 0 0 0 3px var(--focus-ring);
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.module-nav .sidebar-collapse-button {
display: none;
}
@@ -751,7 +751,7 @@ body.sidebar-collapsed .sidebar-collapse-button {
color: var(--text-inverse);
}
@media (max-width: 1023px) and (min-width: 721px) {
@media (max-width: 1023px) and (min-width: 768px) {
.sidebar-collapse-button span {
display: none;
}
@@ -944,33 +944,7 @@ textarea {
font-size: 12px;
}
.chat-input {
display: flex;
gap: 8px;
padding: 12px 16px;
border-top: 1px solid var(--line-soft);
}
.chat-input input {
flex: 1 1 0%;
border: 1px solid var(--line);
border-radius: 8px;
padding: 9px 12px;
outline: none;
}
.chat-input input:focus {
border-color: var(--blue-line);
}
@media (max-width: 720px), (max-width: 1023px) and (max-height: 600px) {
@media (max-width: 767px), (max-width: 1023px) and (max-height: 600px) {
.sidebar-collapse-button {
display: none;
}
@@ -1034,8 +1008,84 @@ textarea {
box-shadow: var(--control-shadow);
}
@media (min-width: 721px) {
@media (min-width: 768px) {
.header-menu-button {
display: none;
}
}
/* Mobile control contract. */
@media (max-width: 767px) {
body.mobile-shell .header-menu-button,
body.mobile-shell .header-actions > .header-menu-button {
width: var(--mobile-touch-size);
min-width: var(--mobile-touch-size);
height: var(--mobile-touch-size);
min-height: var(--mobile-touch-size);
display: grid;
place-items: center;
}
body.mobile-shell .header-command-group .command-button {
width: 100%;
height: auto;
min-height: var(--mobile-touch-size);
justify-content: flex-start;
padding: 0 var(--space-12);
border: 1px solid var(--border);
border-radius: var(--radius-md);
background: var(--control-surface);
color: var(--text-primary);
}
body.mobile-shell .header-command-group .command-button > span {
display: inline;
}
body.mobile-shell .mobile-command-shortcut {
width: 100%;
height: auto;
min-height: var(--mobile-touch-size);
}
body.mobile-shell .mobile-market-selector:not([hidden]) {
position: relative;
width: 100%;
height: var(--mobile-touch-size);
min-height: var(--mobile-touch-size);
display: grid;
grid-template-columns: auto minmax(0, 1fr) var(--mobile-nav-icon-size);
align-items: center;
gap: var(--space-8);
margin: var(--mobile-page-pad) 0 0;
padding: 0 var(--space-12);
border: 1px solid var(--border);
border-radius: var(--radius-md);
background: var(--surface);
box-shadow: none;
}
body.mobile-shell .mobile-market-selector select {
width: 100%;
height: calc(var(--mobile-touch-size) - 2px);
min-height: 0;
padding: 0;
border: 0;
background: transparent;
color: var(--text-primary);
font-size: var(--font-size-body);
font-weight: var(--font-weight-semibold);
text-align: right;
appearance: none;
}
body.mobile-shell :is(.button, .icon-button, button) {
touch-action: manipulation;
}
}
:root[data-theme="dark"] .mobile-command-shortcut {
border-color: var(--border);
background: var(--surface-subtle);
color: var(--text-secondary);
}
app/frontend/shared/components/dialogs.css
+4 -4
View File
@@ -53,7 +53,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.dialog-header-actions {
flex-wrap: wrap;
@@ -189,7 +189,7 @@
font-size: 12px;
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.global-search-dialog {
width: calc(-16px + 100vw);
@@ -431,7 +431,7 @@
height: 34px;
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.alerts-dialog {
width: calc(-16px + 100vw);
@@ -713,7 +713,7 @@
font-size: 10px;
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.assistant-dialog {
max-width: none;
app/frontend/shared/components/feedback.css
+1 -5
View File
@@ -14,10 +14,6 @@
}
}
.loading-message p {
color: var(--text-muted);
}
@keyframes breathe-core {
0%,
100% {
@@ -163,7 +159,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
@keyframes command-menu-enter {
0% {
opacity: 0;
app/frontend/shared/components/navigation.css
+39 -3
View File
@@ -23,7 +23,7 @@
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.toolbar-controls {
width: 100%;
@@ -143,7 +143,7 @@
box-shadow: rgba(0, 0, 0, 0.08) 0px 1px 2px;
}
@media (max-width: 720px), (max-width: 1023px) and (max-height: 600px) {
@media (max-width: 767px), (max-width: 1023px) and (max-height: 600px) {
.redesigned-page-head .toolbar-controls {
width: 100%;
@@ -219,8 +219,44 @@
}
}
@media (min-width: 721px) {
@media (min-width: 768px) {
.toolbar-controls {
align-items: center;
}
}
/* Mobile navigation and filter contract. */
@media (max-width: 767px) {
body.mobile-shell .toolbar-controls,
body.mobile-shell .redesigned-page-head .toolbar-controls {
width: 100%;
min-width: 0;
display: flex;
align-items: center;
gap: var(--space-8);
margin-left: 0;
overflow-x: auto;
overflow-y: hidden;
scrollbar-width: none;
}
body.mobile-shell .toolbar-controls::-webkit-scrollbar,
body.mobile-shell .redesigned-page-head .toolbar-controls::-webkit-scrollbar {
display: none;
}
body.mobile-shell .segmented,
body.mobile-shell .redesigned-page-head .segmented {
width: max-content;
min-width: max-content;
min-height: var(--mobile-touch-size);
flex: 0 0 auto;
}
body.mobile-shell .segment,
body.mobile-shell .redesigned-page-head .segment {
min-width: var(--mobile-touch-size);
min-height: calc(var(--mobile-touch-size) - var(--space-4));
padding: 0 var(--space-12);
}
}
app/frontend/shared/components/tables.css
+1 -1
View File
@@ -157,7 +157,7 @@
background: var(--table-selected);
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.data-table {
font-size: 12.5px;
}
app/frontend/shared/shell.css
+426 -27
View File
@@ -65,21 +65,13 @@ body.sidebar-collapsed .nav-group + .nav-group {
border-top: 1px solid var(--border);
}
@media (min-width: 721px) and (max-width: 1279px) {
@media (min-width: 768px) and (max-width: 1279px) {
.header-actions {
grid-column: 3;
}
}
@media (min-width: 721px) and (max-width: 1023px) {
.module-nav {
width: 64px;
padding-right: 7px;
padding-left: 7px;
}
@media (min-width: 768px) and (max-width: 1023px) {
.nav-group:first-of-type {
margin-top: 10px;
}
@@ -93,7 +85,7 @@ body.sidebar-collapsed .nav-group + .nav-group {
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.market-tape {
display: none;
}
@@ -139,6 +131,16 @@ body.sidebar-collapsed .nav-group + .nav-group {
.status-bar {
display: none;
}
body:is(
[data-active-view="screenerView"],
[data-active-view="screenerTrackingView"],
[data-active-view="mentorView"],
[data-active-view="heavenView"],
[data-active-view="reviewWorkspaceView"]
) .overview-strip {
display: none;
}
}
.market-breadth-panel .workspace-heading {
@@ -295,7 +297,7 @@ body.sidebar-collapsed .nav-group + .nav-group {
font-weight: 770;
}
@media (min-width: 721px) and (max-width: 1279px) {
@media (min-width: 768px) and (max-width: 1279px) {
body.sidebar-collapsed .module-nav {
width: 68px;
@@ -315,7 +317,7 @@ body.sidebar-collapsed .nav-group + .nav-group {
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.header-command-group {
position: fixed;
@@ -441,7 +443,7 @@ body.sidebar-collapsed .module-tab {
padding: 0px;
}
@media (min-width: 721px) and (max-width: 1023px) {
@media (min-width: 768px) and (max-width: 1023px) {
.module-tab span {
display: none;
}
@@ -457,7 +459,7 @@ body.sidebar-collapsed .module-tab {
}
}
@media (min-width: 721px) and (max-width: 1279px) {
@media (min-width: 768px) and (max-width: 1279px) {
.module-tab span {
display: none;
}
@@ -473,7 +475,7 @@ body.sidebar-collapsed .module-tab {
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.header-date-group .icon-button {
width: 30px;
@@ -535,7 +537,7 @@ body.sidebar-collapsed .module-tab {
border-right-color: var(--border);
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.metric {
gap: 2px;
@@ -557,7 +559,7 @@ body.sidebar-collapsed .module-tab {
font-size: 11px;
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.metric-label {
font-size: 10.5px;
}
@@ -695,7 +697,7 @@ body.sidebar-collapsed .app-main {
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
.module-nav .market-sub-tab {
display: none;
}
@@ -1015,7 +1017,7 @@ body.sidebar-collapsed .app-main {
}
}
@media (min-width: 721px) and (max-width: 1279px) {
@media (min-width: 768px) and (max-width: 1279px) {
.app-header {
padding-left: 8px;
@@ -1033,7 +1035,7 @@ body.sidebar-collapsed .app-main {
}
}
@media (max-width: 720px) {
@media (max-width: 767px) {
body.sidebar-collapsed {
display: block;
@@ -2055,7 +2057,7 @@ body.sidebar-collapsed .status-bar {
}
}
@media (max-width: 1023px) and (min-width: 721px) {
@media (max-width: 1023px) and (min-width: 768px) {
.module-nav {
width: 64px;
@@ -2089,7 +2091,7 @@ body.sidebar-collapsed .status-bar {
}
}
@media (max-width: 720px), (max-width: 1023px) and (max-height: 600px) {
@media (max-width: 767px), (max-width: 1023px) and (max-height: 600px) {
.redesigned-page-head .section-title-group {
width: 100%;
@@ -2101,7 +2103,7 @@ body.sidebar-collapsed .status-bar {
}
}
@media (min-width: 721px) {
@media (min-width: 768px) {
.app-main {
min-height: 0px;
@@ -2397,7 +2399,7 @@ body.sidebar-collapsed .status-bar {
background: transparent;
}
@media (min-width: 721px) {
@media (min-width: 768px) {
body:is([data-active-view="sentimentCycleView"], [data-active-view="yesterdayView"]) .app-main {
height: var(--workspace-height);
@@ -2449,7 +2451,7 @@ body.sidebar-collapsed .status-bar {
}
}
@media (max-width: 720px), (max-width: 1023px) and (max-height: 600px) {
@media (max-width: 767px), (max-width: 1023px) and (max-height: 600px) {
body.sidebar-collapsed {
display: block;
@@ -2808,7 +2810,7 @@ body.sidebar-collapsed .status-bar {
color: var(--text-primary);
}
@media (min-width: 721px) {
@media (min-width: 768px) {
.header-actions > .icon-button {
min-width: 31px;
}
@@ -2823,3 +2825,400 @@ body.sidebar-collapsed .status-bar {
align-items: center;
}
}
@media (min-width: 768px) and (max-width: 1023px) {
.main,
body.sidebar-collapsed .main {
width: calc(100% - var(--sidebar-compact-width));
min-width: 0;
margin-left: var(--sidebar-compact-width);
}
.module-nav,
body.sidebar-collapsed .module-nav {
width: var(--sidebar-compact-width);
padding-right: 7px;
padding-left: 7px;
}
.status-bar,
body.sidebar-collapsed .status-bar {
left: var(--sidebar-compact-width);
}
}
/* Canonical mobile shell. Page-specific responsive rules remain with each page. */
.mobile-page-context,
.mobile-command-shortcuts,
.mobile-command-backdrop {
display: none;
}
@media (max-width: 767px) {
.mobile-shell,
.mobile-shell.sidebar-collapsed {
display: block;
min-height: 100dvh;
padding-bottom: var(--mobile-content-bottom);
}
body.mobile-shell .main,
body.mobile-shell.sidebar-collapsed .main {
width: 100%;
min-width: 0;
min-height: 100dvh;
margin-left: 0;
}
body.mobile-shell .app-header {
position: sticky;
top: 0;
z-index: var(--mobile-layer-header);
width: 100%;
height: var(--mobile-header-height);
min-height: var(--mobile-header-height);
display: flex;
align-items: center;
gap: var(--space-8);
padding: var(--space-4) var(--mobile-shell-pad);
border-bottom: 1px solid var(--border);
background: var(--surface);
box-shadow: none;
}
body.mobile-shell.mobile-command-open .app-header {
z-index: var(--mobile-layer-menu);
}
body.mobile-shell .mobile-page-context {
min-width: 0;
display: flex;
flex: 1 1 auto;
flex-direction: column;
justify-content: center;
gap: 0;
}
body.mobile-shell .mobile-page-context span {
color: var(--text-tertiary);
font-size: var(--font-size-aux);
line-height: 1.2;
}
body.mobile-shell .mobile-page-context strong {
overflow: hidden;
color: var(--text-primary);
font-size: var(--font-size-body);
font-weight: var(--font-weight-bold);
line-height: 1.35;
text-overflow: ellipsis;
white-space: nowrap;
}
body.mobile-shell .market-tape,
body.mobile-shell .header-actions > :is(.global-search-button, .theme-toggle, .alert-button, .assistant-button) {
display: none;
}
body.mobile-shell .header-actions {
position: static;
width: auto;
min-width: 0;
display: flex;
flex: 0 0 auto;
align-items: center;
gap: var(--space-4);
margin: 0;
}
body.mobile-shell .header-date-group {
width: var(--mobile-date-width);
height: var(--mobile-touch-size);
min-height: var(--mobile-touch-size);
padding: 0 var(--space-4);
border: 1px solid var(--border);
border-radius: var(--radius-md);
background: var(--control-surface);
}
body.mobile-shell .header-date-group > .icon-button {
display: none;
}
body.mobile-shell .header-date-group .date-input {
width: 100%;
height: calc(var(--mobile-touch-size) - 2px);
min-width: 0;
padding: 0;
border: 0;
background: transparent;
color: var(--text-primary);
font-size: var(--font-size-caption);
font-weight: var(--font-weight-semibold);
}
body.mobile-shell .app-header .header-actions > .header-menu-button {
width: var(--mobile-touch-size);
min-width: var(--mobile-touch-size);
height: var(--mobile-touch-size);
min-height: var(--mobile-touch-size);
display: grid;
place-items: center;
padding: 0;
border: 1px solid var(--border);
border-radius: var(--radius-md);
background: var(--control-surface);
}
body.mobile-shell .header-command-group {
position: fixed;
inset: auto var(--mobile-shell-pad) var(--mobile-content-bottom);
z-index: var(--mobile-layer-menu);
width: auto;
max-height: calc(100dvh - var(--mobile-header-height) - var(--mobile-content-bottom) - var(--space-16));
display: none;
grid-template-columns: 1fr;
align-items: stretch;
gap: var(--space-8);
padding: var(--space-12);
overflow-y: auto;
border: 1px solid var(--border);
border-radius: var(--radius-lg);
background: var(--surface-overlay);
box-shadow: var(--shadow-float);
}
body.mobile-shell .header-command-group.is-open {
display: grid;
}
body.mobile-shell .mobile-command-shortcuts {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: var(--space-8);
padding-bottom: var(--space-8);
border-bottom: 1px solid var(--border-subtle);
}
body.mobile-shell .header-command-group .mobile-command-shortcuts > .mobile-command-shortcut {
min-width: 0;
min-height: var(--mobile-touch-size);
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
gap: var(--space-4);
padding: var(--space-8) var(--space-4);
border: 1px solid var(--border);
border-radius: var(--radius-md);
background: var(--surface-subtle);
color: var(--text-secondary);
font-size: var(--font-size-caption);
}
body.mobile-shell .header-command-group > .command-button,
body.mobile-shell .header-command-group .account-button {
width: 100%;
min-height: var(--mobile-touch-size);
justify-content: flex-start;
}
body.mobile-shell .header-command-group .account-dropdown {
position: static;
grid-column: 1 / -1;
width: 100%;
margin-top: var(--space-8);
}
body.mobile-shell .mobile-command-backdrop:not([hidden]) {
position: fixed;
inset: 0;
z-index: var(--mobile-layer-backdrop);
display: block;
width: 100%;
height: 100%;
border: 0;
background: var(--backdrop);
}
body.mobile-shell .module-nav,
body.mobile-shell.sidebar-collapsed .module-nav {
position: fixed;
inset: auto 0 0;
z-index: var(--mobile-layer-nav);
width: 100%;
height: calc(var(--mobile-nav-height) + var(--mobile-safe-bottom));
min-height: calc(var(--mobile-nav-height) + var(--mobile-safe-bottom));
max-height: calc(var(--mobile-nav-height) + var(--mobile-safe-bottom));
display: grid;
grid-template-columns: repeat(5, minmax(0, 1fr));
align-items: start;
gap: 0;
padding: var(--space-4) var(--space-4) max(var(--space-4), var(--mobile-safe-bottom));
overflow: hidden;
border: 0;
border-top: 1px solid var(--border);
background: var(--surface-overlay);
box-shadow: var(--elevation-raised);
}
body.mobile-shell .module-nav :is(.sidebar-brand, .nav-group-label, .market-sub-tab, .sidebar-collapse-button),
body.mobile-shell.sidebar-collapsed .module-nav :is(.sidebar-brand, .nav-group-label, .market-sub-tab, .sidebar-collapse-button) {
display: none;
}
body.mobile-shell .module-nav .nav-group,
body.mobile-shell.sidebar-collapsed .module-nav .nav-group {
display: contents;
margin: 0;
padding: 0;
border: 0;
}
body.mobile-shell .module-nav .module-tab,
body.mobile-shell.sidebar-collapsed .module-nav .module-tab {
display: none;
}
body.mobile-shell .module-nav .module-tab.mobile-primary-tab,
body.mobile-shell.sidebar-collapsed .module-nav .module-tab.mobile-primary-tab {
position: relative;
min-width: 0;
min-height: var(--mobile-tab-height);
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
gap: var(--space-4);
margin: 0;
padding: var(--space-4);
border: 0;
border-radius: var(--radius-md);
background: transparent;
color: var(--text-tertiary);
font-size: var(--font-size-aux);
font-weight: var(--font-weight-medium);
}
body.mobile-shell .module-nav .module-tab.mobile-primary-tab .lucide {
width: var(--mobile-nav-icon-size);
height: var(--mobile-nav-icon-size);
}
body.mobile-shell .module-nav .module-tab.mobile-primary-tab:is(.active, .mobile-active) {
background: var(--action-soft);
color: var(--action);
font-weight: var(--font-weight-semibold);
}
body.mobile-shell .module-nav .module-tab.mobile-primary-tab span,
body.mobile-shell.sidebar-collapsed .module-nav .module-tab.mobile-primary-tab span {
display: block;
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
body.mobile-shell .module-nav .module-tab.mobile-primary-tab .nav-label-desktop {
display: none;
}
body.mobile-shell .module-nav .module-tab.mobile-primary-tab .nav-label-mobile {
display: block;
}
body.mobile-shell .app-main,
body.mobile-shell.sidebar-collapsed .app-main,
body.mobile-shell:is([data-active-view]) .app-main {
width: 100%;
height: auto;
min-height: calc(100dvh - var(--mobile-header-height) - var(--mobile-content-bottom));
display: block;
margin: 0;
padding: 0 var(--mobile-page-pad) var(--mobile-page-pad);
overflow: visible;
background: var(--surface-canvas);
}
body.mobile-shell .overview-strip,
body.mobile-shell .overview-strip[data-overview-expanded="true"] {
width: calc(100% + var(--mobile-page-pad) + var(--mobile-page-pad));
height: var(--mobile-tab-height);
min-height: var(--mobile-tab-height);
display: flex;
margin: 0 calc(var(--mobile-page-pad) * -1);
padding: 0 var(--mobile-page-pad);
overflow-x: auto;
overflow-y: hidden;
border-bottom: 1px solid var(--border);
background: var(--surface);
scrollbar-width: none;
}
body.mobile-shell .overview-strip::-webkit-scrollbar {
display: none;
}
body.mobile-shell .overview-strip .row {
width: max-content;
min-width: 100%;
display: flex;
align-items: center;
gap: var(--space-8);
padding: 0;
}
body.mobile-shell .overview-strip .sentiment-block,
body.mobile-shell .overview-strip .metric,
body.mobile-shell .overview-strip[data-overview-expanded="true"] .metric {
min-width: max-content;
min-height: var(--mobile-touch-size);
display: flex;
flex: 0 0 auto;
flex-direction: row;
align-items: center;
gap: var(--space-4);
padding: 0 var(--space-8);
border: 0;
background: transparent;
}
body.mobile-shell .overview-strip .metric:nth-of-type(n) {
display: flex;
}
body.mobile-shell .overview-strip .metric-wide,
body.mobile-shell .overview-toggle {
display: none;
}
body.mobile-shell .workspace-view,
body.mobile-shell .workspace-view.page:not(#heavenView),
body.mobile-shell:is([data-active-view]) .workspace-view.active-view {
width: 100%;
height: auto;
min-height: 0;
margin: 0;
padding: var(--mobile-page-pad) 0 0;
overflow: visible;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
}
body.mobile-shell .status-bar {
display: none;
}
}
@media (max-width: 359px) {
.header-date-group {
width: calc(var(--mobile-date-width) - var(--space-16));
}
.mobile-page-context span {
display: none;
}
}
app/frontend/shared/shell.js
+41 -3
View File
@@ -2,25 +2,42 @@
"use strict";
const SIDEBAR_STORAGE_KEY = "xiaobai-sidebar-collapsed";
const MOBILE_BREAKPOINT = 767;
function isMobileViewport() {
return global.matchMedia(`(max-width: ${MOBILE_BREAKPOINT}px)`).matches;
}
function create(options) {
const state = options.state;
const registry = options.pages;
let initialized = false;
function syncViewportMode() {
document.body.classList.toggle("mobile-shell", isMobileViewport());
}
function toggleHeaderCommandMenu(force) {
const menu = document.querySelector("#headerCommandGroup");
const button = document.querySelector("#headerMenuButton");
const backdrop = document.querySelector("#mobileCommandBackdrop");
if (!menu || !button) return;
const open = typeof force === "boolean" ? force : !menu.classList.contains("is-open");
menu.classList.toggle("is-open", open);
button.setAttribute("aria-expanded", String(open));
document.body.classList.toggle("mobile-command-open", open && isMobileViewport());
if (backdrop) backdrop.hidden = !(open && isMobileViewport());
if (open && isMobileViewport()) {
global.requestAnimationFrame(() => menu.querySelector("button:not([hidden])")?.focus({ preventScroll: true }));
} else if (force === false && document.activeElement && menu.contains(document.activeElement)) {
button.focus({ preventScroll: true });
}
}
function updateSidebarControl() {
const button = document.querySelector("#sidebarCollapseButton");
if (!button) return;
const automaticallyCollapsed = global.innerWidth <= 1023 && global.innerWidth > 720;
const automaticallyCollapsed = global.innerWidth <= 1023 && !isMobileViewport();
const collapsed = document.body.classList.contains("sidebar-collapsed") || automaticallyCollapsed;
button.setAttribute("aria-expanded", String(!collapsed));
button.setAttribute("aria-label", collapsed ? "展开侧栏" : "收起侧栏");
@@ -44,11 +61,19 @@
const navigationId = page?.navigation_alias || viewId;
const marketView = page?.group === "market";
document.body.dataset.activeView = viewId;
const mobileGroup = document.querySelector("#mobilePageGroup");
const mobileTitle = document.querySelector("#mobilePageTitle");
if (mobileGroup) {
mobileGroup.textContent = page?.group === "market"
? "行情"
: page?.group === "personal" ? "复盘" : "工具";
}
if (mobileTitle) mobileTitle.textContent = page?.title || "小白复盘";
document.querySelectorAll(".module-tab").forEach((button) => {
button.classList.toggle("active", button.dataset.view === navigationId);
button.classList.toggle(
"mobile-active",
global.innerWidth <= 720
isMobileViewport()
&& marketView
&& button.dataset.view === "limitPool"
&& viewId !== "limitPool",
@@ -127,6 +152,7 @@
collapsed = false;
}
document.body.classList.toggle("sidebar-collapsed", collapsed);
syncViewportMode();
updateSidebarControl();
syncNavigation(state.activeView);
document.querySelectorAll(".module-tab").forEach((button) => {
@@ -143,6 +169,16 @@
event.stopPropagation();
toggleHeaderCommandMenu();
});
document.querySelector("#mobileCommandBackdrop")?.addEventListener("click", () => {
toggleHeaderCommandMenu(false);
});
document.querySelectorAll("[data-mobile-command-target]").forEach((button) => {
button.addEventListener("click", () => {
const target = document.getElementById(button.dataset.mobileCommandTarget || "");
toggleHeaderCommandMenu(false);
target?.click();
});
});
document.querySelector("#headerCommandGroup")?.addEventListener("click", (event) => {
if (event.target.closest("button") && !event.target.closest(".account-menu-shell")) {
toggleHeaderCommandMenu(false);
@@ -170,7 +206,8 @@
if (event.key === "Escape") toggleHeaderCommandMenu(false);
});
global.addEventListener("resize", () => {
if (global.innerWidth > 720) toggleHeaderCommandMenu(false);
toggleHeaderCommandMenu(false);
syncViewportMode();
updateSidebarControl();
syncNavigation(state.activeView);
});
@@ -184,6 +221,7 @@
setPageStatus,
setStatus,
syncNavigation,
syncViewportMode,
toggleHeaderCommandMenu,
toggleSidebar,
updateSidebarControl,
app/frontend/shared/tokens.css
+27 -5
View File
@@ -150,6 +150,7 @@
--space-24: 24px;
--sidebar-width: var(--size-sidebar);
--sidebar-compact-width: 64px;
--topbar-height: var(--size-topbar);
--summary-height: var(--size-summary);
--statusbar-height: var(--size-statusbar);
@@ -173,12 +174,25 @@
--sentiment-history-min-height: 220px;
--primary-share: 1.45fr;
--secondary-share: .75fr;
--mobile-nav-height: 58px;
--mobile-header-height: 50px;
--mobile-tab-height: 54px;
--mobile-shell-pad: 8px;
--mobile-page-pad: 10px;
--mobile-nav-height: 64px;
--mobile-header-height: 52px;
--mobile-tab-height: 56px;
--mobile-touch-size: 44px;
--mobile-date-width: 116px;
--mobile-nav-icon-size: 20px;
--mobile-chart-height: 240px;
--mobile-table-min-height: 260px;
--mobile-phase-badge-width: 88px;
--mobile-summary-card-width: 124px;
--mobile-shell-pad: var(--space-8);
--mobile-page-pad: var(--space-12);
--mobile-min-width: 320px;
--mobile-safe-bottom: env(safe-area-inset-bottom, 0px);
--mobile-content-bottom: calc(var(--mobile-nav-height) + var(--mobile-safe-bottom) + var(--mobile-page-pad));
--mobile-layer-header: 50;
--mobile-layer-nav: 70;
--mobile-layer-menu: 80;
--mobile-layer-backdrop: 75;
--font-aux: var(--font-size-aux);
--dragon-profile-list-width: 340px;
@@ -205,6 +219,14 @@
--dragon-profile-weight-strong: 750;
--dragon-profile-weight-semibold: 600;
--mentor-directory-width: 280px;
--mentor-profile-width: 272px;
--mentor-pane-header-height: 58px;
--mentor-avatar-size: 38px;
--mentor-profile-avatar-size: 68px;
--mentor-composer-min-height: 94px;
--mentor-message-max-width: 82%;
--chart-background: #fbfcfd;
--chart-grid: #e2e8ec;
--chart-axis: #6c7983;