Improve OKX options sizing, expiry sync, and multi-position accordion UI.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-07-09 16:51:48 +08:00
parent d092f213a7
commit f41af0bf1c
7 changed files with 542 additions and 18 deletions
+119
View File
@@ -3254,6 +3254,102 @@ html[data-theme="light"] .options-estimate-row {
font-size: 0.76rem;
margin-bottom: 8px;
}
.opt-pos-cards--accordion {
display: flex;
flex-direction: column;
gap: 6px;
}
.opt-pos-accordion-item {
display: flex;
flex-direction: column;
}
.opt-pos-bar {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
padding: 8px 10px;
background: #141923;
border: 1px solid #2a3348;
border-radius: 8px;
cursor: pointer;
text-align: left;
color: inherit;
font: inherit;
transition: border-color 0.15s, background 0.15s;
}
.opt-pos-bar:hover {
border-color: #3d4d6e;
background: #171d2a;
}
.opt-pos-accordion-item.is-expanded .opt-pos-bar {
border-radius: 8px 8px 0 0;
border-bottom-color: transparent;
background: #171d2a;
}
.opt-pos-bar-main {
display: flex;
align-items: center;
gap: 6px;
min-width: 0;
flex: 1;
}
.opt-pos-bar-side {
display: flex;
align-items: center;
gap: 10px;
flex-shrink: 0;
font-variant-numeric: tabular-nums;
}
.opt-pos-bar-title {
font-size: 0.72rem;
font-weight: 600;
color: #fff;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 11rem;
}
.opt-pos-bar-meta {
font-size: 0.66rem;
color: #8b95b0;
white-space: nowrap;
}
.opt-pos-bar-cd {
font-size: 0.66rem;
color: #8b95b0;
white-space: nowrap;
}
.opt-pos-bar-pnl,
.opt-pos-bar-roi {
font-size: 0.72rem;
font-weight: 600;
white-space: nowrap;
}
.opt-pos-bar-chevron {
display: inline-block;
font-size: 0.58rem;
color: #8b95b0;
transition: transform 0.15s ease;
flex-shrink: 0;
}
.opt-pos-accordion-item.is-expanded .opt-pos-bar-chevron {
transform: rotate(90deg);
}
.opt-pos-accordion-body {
border: 1px solid #2a3348;
border-top: none;
border-radius: 0 0 8px 8px;
overflow: hidden;
background: #141923;
}
.opt-pos-card--nested {
margin-bottom: 0 !important;
border: none !important;
border-radius: 0 !important;
background: transparent !important;
}
.options-page-wrap .opt-pos-card .pos-card-symbol strong {
font-size: 0.78rem;
}
@@ -3441,6 +3537,29 @@ html[data-theme="light"] .options-settings-subtitle {
color: #142232 !important;
}
html[data-theme="light"] .opt-pos-bar {
background: #f6f9fc;
border-color: #c8d4e0;
color: #142232;
}
html[data-theme="light"] .opt-pos-bar:hover,
html[data-theme="light"] .opt-pos-accordion-item.is-expanded .opt-pos-bar {
background: #eef3f8;
border-color: #9eb0c4;
}
html[data-theme="light"] .opt-pos-bar-title {
color: #142232;
}
html[data-theme="light"] .opt-pos-bar-meta,
html[data-theme="light"] .opt-pos-bar-cd,
html[data-theme="light"] .opt-pos-bar-chevron {
color: #5a6d82;
}
html[data-theme="light"] .opt-pos-accordion-body {
background: #f6f9fc;
border-color: #c8d4e0;
}
html[data-theme="light"] .options-page-wrap .options-hint,
html[data-theme="light"] .options-page-wrap #opt-index-line,
html[data-theme="light"] .options-order-grid .k,