diff --git a/docs/更新文档.md b/docs/更新文档.md index 4513172..a371ad4 100644 --- a/docs/更新文档.md +++ b/docs/更新文档.md @@ -4,6 +4,31 @@ --- +## 2026-07-16 · 1080p 监控区无持仓空洞收紧 + +### 修改原因 + +1920×1080 上一屏适配用 `1fr/1fr` 把永续/分所空卡强行均分拉高,「无持仓」下方大片空洞;带鱼屏尚可,短屏观感差。 + +### 修改的地方 + +| 文件 | 改动摘要 | +|------|----------| +| `manual_trading_hub/static/app.css` | OKX 内卡改为 `auto + 1fr`(永续按内容、期权吃剩余);右侧 Gate/币安改为 `auto auto` 按内容收紧;1080p 短屏左侧略加宽 | +| `manual_trading_hub/static/index.html` | CSS 缓存 `20260716-hub-1080-tight` | + +### 达成的目标 + +无持仓区块不再被拉成半屏空黑;有期权/持仓的区域拿到更多可视高度。 + +### 交付之后的验收 + +1. 1920×1080 监控区:永续「无持仓」仅占内容高度,期权表区域明显变高。 +2. 右侧币安/Gate 无仓时卡片贴内容,不再卡片内大片空洞。 +3. 带鱼屏布局仍可用;持仓变多时右侧列可内滚。 + +--- + ## 2026-07-16 · 电脑端误判平板导致发糊 ### 修改原因 diff --git a/manual_trading_hub/static/app.css b/manual_trading_hub/static/app.css index e0e29cd..a2aaf8b 100644 --- a/manual_trading_hub/static/app.css +++ b/manual_trading_hub/static/app.css @@ -1277,15 +1277,22 @@ html[data-theme="light"] .host-metric-bar { min-height: 0; } -.monitor-split-left > .card, -.monitor-split-right > .card { +.monitor-split-left > .card { height: 100%; } .monitor-split-right { display: grid; - grid-template-rows: 1fr 1fr; + /* 无持仓时勿 1fr 均分拉高,按内容收紧;有仓时自然增高 */ + grid-template-rows: auto auto; + align-content: start; gap: 16px; + overflow: auto; +} + +.monitor-split-right > .card { + height: auto; + min-height: 0; } .card-monitor-okx-split, @@ -1307,7 +1314,8 @@ html[data-theme="light"] .host-metric-bar { .hub-inner-cards { flex: 1; display: grid; - grid-template-rows: 1fr 1fr; + /* 永续按内容高度,期权吃剩余 —— 避免「无持仓」半屏空洞 */ + grid-template-rows: auto minmax(0, 1fr); gap: 12px; min-height: 0; } @@ -9892,6 +9900,13 @@ html[data-theme="light"] .hub-logs-card-hint { body.hub-page-monitor:not(.hub-phone) .monitor-split-right { gap: 8px; + grid-template-rows: auto auto; + align-content: start; + overflow: auto; + } + + body.hub-page-monitor:not(.hub-phone) .monitor-split-right > .card { + height: auto; } body.hub-page-monitor:not(.hub-phone) .card-monitor-okx-split, @@ -9912,6 +9927,7 @@ html[data-theme="light"] .hub-logs-card-hint { body.hub-page-monitor:not(.hub-phone) .hub-inner-cards { gap: 6px; + grid-template-rows: auto minmax(0, 1fr); } body.hub-page-monitor:not(.hub-phone) .hub-inner-card { @@ -9953,10 +9969,17 @@ html[data-theme="light"] .hub-logs-card-hint { } body.hub-page-monitor:not(.hub-phone) .empty-hint { - padding: 6px 0; + padding: 4px 0; font-size: 11px; } + /* 1080p 短屏:左侧略宽,把横向空间给 OKX 期权表 */ + @media (max-height: 1100px) { + body.hub-page-monitor:not(.hub-phone) .grid-monitor-options-split .monitor-split-body { + grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); + } + } + /* —— 行情区 —— */ body.hub-page-market:not(.hub-phone) #page-market { flex: 1 1 auto; @@ -10185,19 +10208,25 @@ body.hub-tablet.hub-page-monitor:not(.hub-phone) .grid-monitor-options-split .mo align-items: stretch; } -body.hub-tablet.hub-page-monitor:not(.hub-phone) .monitor-split-left > .card, -body.hub-tablet.hub-page-monitor:not(.hub-phone) .monitor-split-right > .card { +body.hub-tablet.hub-page-monitor:not(.hub-phone) .monitor-split-left > .card { height: 100%; min-height: 0; } -body.hub-tablet.hub-page-monitor:not(.hub-phone) .monitor-split-right { - grid-template-rows: minmax(0, 1fr) minmax(0, 1fr); - gap: 6px; +body.hub-tablet.hub-page-monitor:not(.hub-phone) .monitor-split-right > .card { + height: auto; min-height: 0; } -/* 竖屏(<960)叠成 OKX 上 + Gate/币安并排,吃满剩余高度 */ +body.hub-tablet.hub-page-monitor:not(.hub-phone) .monitor-split-right { + grid-template-rows: auto auto; + align-content: start; + gap: 6px; + min-height: 0; + overflow: auto; +} + +/* 竖屏(<960)叠成 OKX 上 + Gate/币安并排 */ @media (max-width: 960px) { body.hub-tablet.hub-page-monitor:not(.hub-phone) .monitor-split-body { grid-template-rows: minmax(0, 1.35fr) minmax(0, 1fr); @@ -10205,7 +10234,12 @@ body.hub-tablet.hub-page-monitor:not(.hub-phone) .monitor-split-right { body.hub-tablet.hub-page-monitor:not(.hub-phone) .monitor-split-right { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); - grid-template-rows: minmax(0, 1fr); + grid-template-rows: auto; + align-content: stretch; + } + + body.hub-tablet.hub-page-monitor:not(.hub-phone) .monitor-split-right > .card { + height: 100%; } } @@ -10251,7 +10285,7 @@ body.hub-tablet.hub-page-monitor:not(.hub-phone) .card-monitor-split-side .card- } body.hub-tablet.hub-page-monitor:not(.hub-phone) .hub-inner-cards { - grid-template-rows: minmax(0, 1fr) minmax(0, 1fr); + grid-template-rows: auto minmax(0, 1fr); gap: 5px; min-height: 0; } diff --git a/manual_trading_hub/static/index.html b/manual_trading_hub/static/index.html index 59e361f..0c4fc76 100644 --- a/manual_trading_hub/static/index.html +++ b/manual_trading_hub/static/index.html @@ -15,7 +15,7 @@ - +