Options: frame target and size-mode chips like cancel buttons.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-07-20 08:11:23 +08:00
parent 547eedeec4
commit 4e614eb9ed
5 changed files with 61 additions and 10 deletions
+40 -3
View File
@@ -4083,8 +4083,37 @@ html[data-theme="light"] .opt-pending-item {
border: 1px dashed rgba(255, 255, 255, 0.08);
font-size: 0.74rem;
}
.options-estimate-row .opt-est-label {
color: #8892b0;
.opt-order-chip {
display: inline-flex;
align-items: center;
justify-content: center;
margin: 0;
cursor: pointer;
user-select: none;
font-size: 0.72rem;
padding: 3px 10px;
min-height: 26px;
line-height: 1.2;
white-space: nowrap;
}
.opt-size-mode-chip {
position: relative;
}
.opt-size-mode-chip input[type="radio"] {
position: absolute;
opacity: 0;
width: 0;
height: 0;
margin: 0;
pointer-events: none;
}
.opt-size-mode-chip:has(input:checked),
.opt-size-mode-chip.is-selected,
.opt-size-mode-chip.active {
border-color: #5b8cff;
color: #cfe0ff;
background: rgba(74, 124, 255, 0.28);
box-shadow: inset 0 0 0 1px rgba(120, 160, 255, 0.45);
}
.options-estimate-row .opt-target-idx {
width: 120px;
@@ -4162,12 +4191,17 @@ html[data-theme="light"] .options-estimate-row {
background: rgba(255, 209, 102, 0.12);
}
.options-order-mode-row {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
}
.options-order-mode-row input[type="number"] {
width: 88px;
}
.options-order-mode-row .opt-order-chip {
flex: 0 0 auto;
}
.options-dual-grid {
display: grid;
grid-template-columns: 1.15fr 0.85fr;
@@ -5023,7 +5057,10 @@ html[data-theme="light"] .options-chain-toolbar .btn-secondary.active,
html[data-theme="light"] .opt-uly-btn.active,
html[data-theme="light"] .opt-type-btn.active,
html[data-theme="light"] .opt-money-btn.active,
html[data-theme="light"] .opt-pos-tab.active {
html[data-theme="light"] .opt-pos-tab.active,
html[data-theme="light"] .opt-size-mode-chip.is-selected,
html[data-theme="light"] .opt-size-mode-chip.active,
html[data-theme="light"] .opt-size-mode-chip:has(input:checked) {
border-color: rgba(0, 95, 140, 0.45) !important;
color: #004d6e !important;
background: rgba(0, 110, 154, 0.14) !important;