dekun/crypto_monitor
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Tighten empty monitor cards on 1080p.

Browse Source 
Size no-position blocks to content and give remaining height to options/positions.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-07-16 13:42:26 +08:00
parent 480f6d78e8
commit bde8c517e0
3 changed files with 73 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
manual_trading_hub/static/app.css
+47 -13
View File
@@ -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;
}