修复排列
This commit is contained in:
@@ -478,8 +478,9 @@ button:disabled {
|
||||
|
||||
.grid-monitor {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
gap: 16px;
|
||||
/* 列数由 app.js syncMonitorGridColumns 按卡片数量设置 */
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.settings-grid-wrap {
|
||||
@@ -488,12 +489,6 @@ button:disabled {
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.grid-monitor {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
}
|
||||
|
||||
.stat-row {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
|
||||
@@ -100,6 +100,18 @@
|
||||
return (settingsCache?.exchanges || []).filter((x) => x.enabled);
|
||||
}
|
||||
|
||||
/** 监控卡片列数:3 个一行;4 个 2×2;5/6 个两行(每行最多 3) */
|
||||
function syncMonitorGridColumns(gridEl, count) {
|
||||
if (!gridEl) return;
|
||||
let cols = 3;
|
||||
if (count <= 1) cols = 1;
|
||||
else if (count === 2) cols = 2;
|
||||
else if (count === 3) cols = 3;
|
||||
else if (count === 4) cols = 2;
|
||||
else cols = 3;
|
||||
gridEl.style.gridTemplateColumns = `repeat(${cols}, minmax(0, 1fr))`;
|
||||
}
|
||||
|
||||
async function loadMonitorBoard() {
|
||||
const box = document.getElementById("monitor-grid");
|
||||
try {
|
||||
@@ -116,6 +128,7 @@
|
||||
"UPD " + (data.updated_at || "").replace("T", " ");
|
||||
const parts = rows.map(renderMonitorCard);
|
||||
box.innerHTML = parts.join("") || '<div class="err">无已启用账户</div>';
|
||||
syncMonitorGridColumns(box, rows.length);
|
||||
box.querySelectorAll(".btn-close-ex").forEach((btn) => {
|
||||
btn.onclick = () => closeOne(btn.dataset.id);
|
||||
});
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&family=Orbitron:wght@500;600;700&display=swap" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="/assets/app.css?v=20260522-settings-fix" />
|
||||
<link rel="stylesheet" href="/assets/app.css?v=20260522-grid" />
|
||||
</head>
|
||||
<body>
|
||||
<div class="app-bg" aria-hidden="true"></div>
|
||||
@@ -80,6 +80,6 @@
|
||||
</div>
|
||||
|
||||
<div id="toast"></div>
|
||||
<script src="/assets/app.js?v=20260522-settings-fix"></script>
|
||||
<script src="/assets/app.js?v=20260522-grid"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user