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

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

Browse Source 
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
Download Patch File Download Diff File Expand all files Collapse all files
lib/common/static/instance_theme.css
+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;
lib/common/static/options_panel.js
+5
View File
@@ -275,6 +275,11 @@
const ethEl = document.getElementById("opt-eth-amount");
if (sheetsEl) sheetsEl.style.display = mode === "sheets" ? "" : "none";
if (ethEl) ethEl.style.display = mode === "eth_amount" ? "" : "none";
document.querySelectorAll(".opt-size-mode-chip").forEach(function (chip) {
const radio = chip.querySelector('input[name="opt-size-mode"]');
chip.classList.toggle("is-selected", !!(radio && radio.checked));
chip.classList.toggle("active", !!(radio && radio.checked));
});
}
function hardenOrderAutofill() {
lib/instance/templates/embed_shell.html
+1 -1
View File
@@ -7,7 +7,7 @@
<link rel="stylesheet" href="/static/instance_theme_early.css?v=4">
<link rel="stylesheet" href="/static/account_risk_badge.css?v=4">
<link rel="stylesheet" href="/static/instance_page.css?v=11">
<link rel="stylesheet" href="/static/instance_theme.css?v=99">
<link rel="stylesheet" href="/static/instance_theme.css?v=100">
<script src="/static/account_risk_badge.js?v=4"></script>
<meta name="theme-color" content="#0b0d14">
<title>{{ pwa_app_name }}</title>
lib/instance/templates/index.html
+1 -1
View File
@@ -17,7 +17,7 @@
<link rel="manifest" href="/static/icons/manifest.webmanifest">
<title>{{ pwa_app_name }}</title>
<link rel="stylesheet" href="/static/instance_page.css?v=11">
<link rel="stylesheet" href="/static/instance_theme.css?v=99">
<link rel="stylesheet" href="/static/instance_theme.css?v=100">
</head>
<body
lib/options/templates/options_panel.html
+14 -5
View File
@@ -85,7 +85,7 @@
<div><span class="k">距平衡</span><span id="opt-order-dist-be" class="v">—</span></div>
</div>
<div class="options-estimate-row">
<label class="opt-est-label" for="opt-target-idx">目标位(指数)</label>
<label class="btn-secondary opt-order-chip" for="opt-target-idx">目标位(指数)</label>
<input type="number" id="opt-target-idx" class="opt-target-idx" step="0.1" min="0" placeholder="达价限价平仓">
<span class="k">预计价值</span>
<span id="opt-est-value" class="v">—</span>
@@ -96,11 +96,20 @@
<span class="muted opt-est-note">目标价=监控指数;到位后按买一限价平仓;无止损,到期即止损</span>
</div>
<div class="form-row options-order-mode-row">
<label><input type="radio" name="opt-size-mode" value="sheets" checked> 指定张数</label>
<label class="btn-secondary opt-order-chip opt-size-mode-chip">
<input type="radio" name="opt-size-mode" value="sheets" checked>
<span>指定张数</span>
</label>
<input type="number" id="opt-sheets-amount" min="1" step="1" value="1" placeholder="张数"
autocomplete="off" inputmode="numeric" data-lpignore="true" data-1p-ignore="true" data-form-type="other">
<label><input type="radio" name="opt-size-mode" value="budget_full"> 按可用余额打满</label>
<label><input type="radio" name="opt-size-mode" value="eth_amount" id="opt-size-mode-eth"> 指定币数量</label>
<label class="btn-secondary opt-order-chip opt-size-mode-chip">
<input type="radio" name="opt-size-mode" value="budget_full">
<span>按可用余额打满</span>
</label>
<label class="btn-secondary opt-order-chip opt-size-mode-chip">
<input type="radio" name="opt-size-mode" value="eth_amount" id="opt-size-mode-eth">
<span>指定币数量</span>
</label>
<input type="number" id="opt-eth-amount" min="0.01" step="0.01" placeholder="如 0.5" style="display:none"
autocomplete="off" inputmode="decimal" data-lpignore="true" data-1p-ignore="true" data-form-type="other">
<input type="text" id="opt-signal-note" name="opt_signal_note" placeholder="备注(关键位说明)"
@@ -286,4 +295,4 @@
</div>
</div>
<script src="/static/options_expiry_countdown.js?v=1"></script>
<script src="/static/options_panel.js?v=43"></script>
<script src="/static/options_panel.js?v=44"></script>