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

Add tabbed layout for options positions card.

Browse Source 
Split current positions, stats, and history into tabs to save vertical space and improve readability.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-07-10 11:19:33 +08:00
parent b6d116ec7a
commit b70ce510ef
3 changed files with 82 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/common/static/instance_theme.css
+43 -26
View File
@@ -3033,7 +3033,8 @@ html[data-theme="light"] .opt-be-dist-down {
}
.options-chain-toolbar .btn-secondary.active,
.opt-uly-btn.active,
.opt-type-btn.active {
.opt-type-btn.active,
.opt-pos-tab.active {
border-color: #5b8cff;
color: #cfe0ff;
background: rgba(74, 124, 255, 0.28);
@@ -3191,13 +3192,49 @@ html[data-theme="light"] .options-estimate-row {
flex-direction: column;
min-height: 0;
}
.options-pos-stack {
.options-pos-stack,
.options-pos-tab-body {
flex: 1;
display: flex;
flex-direction: column;
gap: 8px;
min-height: 0;
}
.options-pos-tabs {
display: flex;
gap: 6px;
margin-bottom: 8px;
}
.opt-pos-tab {
flex: 1;
font-size: 0.78rem;
padding: 6px 8px;
min-height: 32px;
white-space: nowrap;
}
.opt-pos-tab.active {
border-color: #5b8cff;
color: #cfe0ff;
background: rgba(74, 124, 255, 0.28);
}
.options-pos-pane {
display: none;
flex: 1;
flex-direction: column;
min-height: 0;
}
.options-pos-pane.is-active {
display: flex;
}
.options-pos-live-pane {
flex: 1;
min-height: 180px;
max-height: 420px;
overflow-y: auto;
}
.options-pos-live-pane.options-pos-live-pane--accordion {
max-height: 480px;
}
.options-pos-subcard {
display: flex;
flex-direction: column;
@@ -3213,22 +3250,14 @@ html[data-theme="light"] .options-estimate-row {
font-size: 0.78rem;
color: #b8c0dc;
}
.options-pos-live-pane {
flex: 1;
min-height: 100px;
max-height: 220px;
overflow-y: auto;
}
.options-pos-live-pane.options-pos-live-pane--accordion {
max-height: 360px;
}
.options-pos-stats-card {
flex-shrink: 0;
}
.options-stats-grid {
display: flex;
flex-wrap: wrap;
gap: 8px 14px;
gap: 10px 16px;
padding: 4px 2px 8px;
}
.options-stat-item {
display: flex;
@@ -3399,7 +3428,8 @@ html[data-theme="light"] .options-estimate-row {
flex: 1;
overflow-y: auto;
overflow-x: auto;
min-height: 120px;
min-height: 180px;
max-height: 420px;
}
.opt-history-table {
table-layout: fixed;
@@ -3485,19 +3515,6 @@ html[data-theme="light"] .options-estimate-row {
.options-pos-head h2 {
margin: 0;
}
.options-pos-tabs {
display: flex;
gap: 8px;
margin-bottom: 10px;
}
.opt-pos-tab.active {
border-color: #5b8cff;
color: #cfe0ff;
background: rgba(74, 124, 255, 0.28);
}
.options-pos-pane {
min-height: 200px;
}
.opt-pos-card {
margin-bottom: 10px;
}