From 6c6ba634519b51453deba16a56949352530b3c3f Mon Sep 17 00:00:00 2001
From: dekun <dekun@local>
Date: Thu, 21 May 2026 15:42:10 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E5=AE=BD=E5=BA=A6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 crypto_monitor_binance/templates/index.html  | 20 ++++++++++++--------
 crypto_monitor_gate/templates/index.html     | 20 ++++++++++++--------
 crypto_monitor_gate_bot/templates/index.html | 18 +++++++++---------
 crypto_monitor_okx/templates/index.html      | 18 +++++++++---------
 4 files changed, 42 insertions(+), 34 deletions(-)

diff --git a/crypto_monitor_binance/templates/index.html b/crypto_monitor_binance/templates/index.html
index bd3d718..710136a 100644
--- a/crypto_monitor_binance/templates/index.html
+++ b/crypto_monitor_binance/templates/index.html
@@ -6,17 +6,17 @@
     <style>
         *{margin:0;padding:0;box-sizing:border-box}
         body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:#0b0d14;color:#eaeaea;padding:14px 20px}
-        .container{max-width:1280px;width:100%;margin:0 auto;padding:0 4px}
+        .container{max-width:1440px;width:100%;margin:0 auto;padding:0 8px}
         .header{display:flex;flex-direction:column;align-items:center;gap:8px;margin-bottom:12px}
         .header h1{font-size:1.75rem;color:#dbe4ff;text-align:center;line-height:1.25}
         .exchange-tag{font-size:.82rem;font-weight:600;color:#b8f5d0;background:#14241e;border:1px solid #2d6a4f;padding:5px 14px;border-radius:999px;letter-spacing:.06em}
         .top-nav{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-bottom:12px}
         .top-nav a{padding:6px 10px;border:1px solid #304164;border-radius:8px;background:#151a2a;color:#8fc8ff;text-decoration:none}
         .top-nav a.active{background:#2a3f6c;color:#dbe4ff}
-        .stat-box{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:10px;margin-bottom:16px}
-        .stat-item{min-width:0;background:#151a2a;padding:10px;border-radius:10px;text-align:center;border:1px solid #2a3152}
-        .stat-item .label{font-size:.8rem;color:#aaa}
-        .stat-item .value{font-size:1.3rem;font-weight:600;color:#fff}
+        .stat-box{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:12px;margin-bottom:16px;align-items:stretch}
+        .stat-item{min-width:0;min-height:76px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;background:#151a2a;padding:12px 10px;border-radius:10px;text-align:center;border:1px solid #2a3152}
+        .stat-item .label{font-size:.8rem;color:#aaa;line-height:1.25;max-width:100%}
+        .stat-item .value{font-size:1.25rem;font-weight:600;color:#fff;line-height:1.3;min-height:1.35em;display:flex;align-items:center;justify-content:center}
         .grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
         .card{background:#121726;border-radius:10px;padding:12px;border:1px solid #2a3150}
         .full{grid-column:1/-1}
@@ -88,7 +88,10 @@
         .panel-scroll{flex:1;min-height:280px;max-height:420px;overflow:auto}
         .records-card{grid-column:1/-1}
         .review-card{grid-column:1/-1}
-        @media (min-width: 1280px){
+        @media (max-width: 1200px){
+            .stat-box{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
+        }
+        @media (min-width: 1440px){
             .panel-scroll,.pos-list{max-height:420px}
             .records-card .table-wrap{max-height:620px;overflow:auto}
         }
@@ -101,10 +104,11 @@
         @media (max-width: 960px){
             body{padding:10px}
             .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
-            .stat-item{min-width:130px}
+            .stat-box{grid-template-columns:repeat(2,minmax(0,1fr))}
         }
         .stats-detail{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin-top:10px}
-        .stats-detail .stat-item{min-width:0;text-align:left;padding:10px 12px}
+        .stats-detail .stat-item{min-width:0;min-height:0;display:block;text-align:left;padding:10px 12px;align-items:stretch;gap:4px}
+        .stats-detail .stat-item .value{min-height:0;display:block;font-size:1.05rem}
         .stats-detail .stat-item .label{font-size:.75rem}
         .stats-detail .stat-item .value{font-size:1.05rem;word-break:break-all}
         .export-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px;font-size:.85rem}
diff --git a/crypto_monitor_gate/templates/index.html b/crypto_monitor_gate/templates/index.html
index e3f0abe..93015b6 100644
--- a/crypto_monitor_gate/templates/index.html
+++ b/crypto_monitor_gate/templates/index.html
@@ -6,17 +6,17 @@
     <style>
         *{margin:0;padding:0;box-sizing:border-box}
         body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:#0b0d14;color:#eaeaea;padding:14px 20px}
-        .container{max-width:1280px;width:100%;margin:0 auto;padding:0 4px}
+        .container{max-width:1440px;width:100%;margin:0 auto;padding:0 8px}
         .header{display:flex;flex-direction:column;align-items:center;gap:8px;margin-bottom:12px}
         .header h1{font-size:1.75rem;color:#dbe4ff;text-align:center;line-height:1.25}
         .exchange-tag{font-size:.82rem;font-weight:600;color:#b8f5d0;background:#14241e;border:1px solid #2d6a4f;padding:5px 14px;border-radius:999px;letter-spacing:.06em}
         .top-nav{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-bottom:12px}
         .top-nav a{padding:6px 10px;border:1px solid #304164;border-radius:8px;background:#151a2a;color:#8fc8ff;text-decoration:none}
         .top-nav a.active{background:#2a3f6c;color:#dbe4ff}
-        .stat-box{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:10px;margin-bottom:16px}
-        .stat-item{min-width:0;background:#151a2a;padding:10px;border-radius:10px;text-align:center;border:1px solid #2a3152}
-        .stat-item .label{font-size:.8rem;color:#aaa}
-        .stat-item .value{font-size:1.3rem;font-weight:600;color:#fff}
+        .stat-box{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:12px;margin-bottom:16px;align-items:stretch}
+        .stat-item{min-width:0;min-height:76px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;background:#151a2a;padding:12px 10px;border-radius:10px;text-align:center;border:1px solid #2a3152}
+        .stat-item .label{font-size:.8rem;color:#aaa;line-height:1.25;max-width:100%}
+        .stat-item .value{font-size:1.25rem;font-weight:600;color:#fff;line-height:1.3;min-height:1.35em;display:flex;align-items:center;justify-content:center}
         .grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
         .card{background:#121726;border-radius:10px;padding:12px;border:1px solid #2a3150}
         .full{grid-column:1/-1}
@@ -88,7 +88,10 @@
         .panel-scroll{flex:1;min-height:280px;max-height:420px;overflow:auto}
         .records-card{grid-column:1/-1}
         .review-card{grid-column:1/-1}
-        @media (min-width: 1280px){
+        @media (max-width: 1200px){
+            .stat-box{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
+        }
+        @media (min-width: 1440px){
             .panel-scroll,.pos-list{max-height:420px}
             .records-card .table-wrap{max-height:620px;overflow:auto}
         }
@@ -101,10 +104,11 @@
         @media (max-width: 960px){
             body{padding:10px}
             .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
-            .stat-item{min-width:130px}
+            .stat-box{grid-template-columns:repeat(2,minmax(0,1fr))}
         }
         .stats-detail{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin-top:10px}
-        .stats-detail .stat-item{min-width:0;text-align:left;padding:10px 12px}
+        .stats-detail .stat-item{min-width:0;min-height:0;display:block;text-align:left;padding:10px 12px;align-items:stretch;gap:4px}
+        .stats-detail .stat-item .value{min-height:0;display:block;font-size:1.05rem}
         .stats-detail .stat-item .label{font-size:.75rem}
         .stats-detail .stat-item .value{font-size:1.05rem;word-break:break-all}
         .export-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px;font-size:.85rem}
diff --git a/crypto_monitor_gate_bot/templates/index.html b/crypto_monitor_gate_bot/templates/index.html
index f8ca4d5..e34dbd0 100644
--- a/crypto_monitor_gate_bot/templates/index.html
+++ b/crypto_monitor_gate_bot/templates/index.html
@@ -6,17 +6,17 @@
     <style>
         *{margin:0;padding:0;box-sizing:border-box}
         body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:#0b0d14;color:#eaeaea;padding:14px 20px}
-        .container{max-width:1280px;width:100%;margin:0 auto;padding:0 4px}
+        .container{max-width:1440px;width:100%;margin:0 auto;padding:0 8px}
         .header{display:flex;flex-direction:column;align-items:center;gap:8px;margin-bottom:12px}
         .header h1{font-size:1.75rem;color:#dbe4ff;text-align:center;line-height:1.25}
         .exchange-tag{font-size:.82rem;font-weight:600;color:#b8f5d0;background:#14241e;border:1px solid #2d6a4f;padding:5px 14px;border-radius:999px;letter-spacing:.06em}
         .top-nav{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-bottom:12px}
         .top-nav a{padding:6px 10px;border:1px solid #304164;border-radius:8px;background:#151a2a;color:#8fc8ff;text-decoration:none}
         .top-nav a.active{background:#2a3f6c;color:#dbe4ff}
-        .stat-box{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:10px;margin-bottom:16px}
-        .stat-item{min-width:0;background:#151a2a;padding:10px;border-radius:10px;text-align:center;border:1px solid #2a3152}
-        .stat-item .label{font-size:.8rem;color:#aaa}
-        .stat-item .value{font-size:1.3rem;font-weight:600;color:#fff}
+        .stat-box{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:12px;margin-bottom:16px;align-items:stretch}
+        .stat-item{min-width:0;min-height:76px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;background:#151a2a;padding:12px 10px;border-radius:10px;text-align:center;border:1px solid #2a3152}
+        .stat-item .label{font-size:.8rem;color:#aaa;line-height:1.25;max-width:100%}
+        .stat-item .value{font-size:1.25rem;font-weight:600;color:#fff;line-height:1.3;min-height:1.35em;display:flex;align-items:center;justify-content:center}
         .grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
         .card{background:#121726;border-radius:10px;padding:12px;border:1px solid #2a3150}
         .full{grid-column:1/-1}
@@ -112,7 +112,7 @@
         .btn-close-plan:hover{filter:brightness(1.08)}
         .records-card{grid-column:1/-1}
         .review-card{grid-column:1/-1}
-        @media (min-width: 1280px){
+        @media (min-width: 1440px){
             .order-card .order-live-positions{max-height:420px}
             .records-card .table-wrap{max-height:620px;overflow:auto}
         }
@@ -127,12 +127,12 @@
         @media (max-width: 960px){
             body{padding:10px}
             .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
-            .stat-item{min-width:130px}
+            .stat-box{grid-template-columns:repeat(2,minmax(0,1fr))}
         }
         .stats-detail{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin-top:10px}
-        .stats-detail .stat-item{min-width:0;text-align:left;padding:10px 12px}
+        .stats-detail .stat-item{min-width:0;min-height:0;display:block;text-align:left;padding:10px 12px;align-items:stretch;gap:4px}
         .stats-detail .stat-item .label{font-size:.75rem}
-        .stats-detail .stat-item .value{font-size:1.05rem;word-break:break-all}
+        .stats-detail .stat-item .value{min-height:0;display:block;font-size:1.05rem;word-break:break-all}
         .export-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px;font-size:.85rem}
         .export-bar a{color:#8fc8ff;text-decoration:none;padding:6px 10px;border:1px solid #304164;border-radius:8px;background:#151a2a}
         .export-bar a:hover{background:#1f2740}
diff --git a/crypto_monitor_okx/templates/index.html b/crypto_monitor_okx/templates/index.html
index 8308cff..d9a4da8 100644
--- a/crypto_monitor_okx/templates/index.html
+++ b/crypto_monitor_okx/templates/index.html
@@ -6,16 +6,16 @@
     <style>
         *{margin:0;padding:0;box-sizing:border-box}
         body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:#0b0d14;color:#eaeaea;padding:14px 20px}
-        .container{max-width:1280px;width:100%;margin:0 auto;padding:0 4px}
+        .container{max-width:1440px;width:100%;margin:0 auto;padding:0 8px}
         .header{text-align:center;margin-bottom:12px}
         .header h1{font-size:1.75rem;color:#dbe4ff}
         .top-nav{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-bottom:12px}
         .top-nav a{padding:6px 10px;border:1px solid #304164;border-radius:8px;background:#151a2a;color:#8fc8ff;text-decoration:none}
         .top-nav a.active{background:#2a3f6c;color:#dbe4ff}
-        .stat-box{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:10px;margin-bottom:16px}
-        .stat-item{min-width:0;background:#151a2a;padding:10px;border-radius:10px;text-align:center;border:1px solid #2a3152}
-        .stat-item .label{font-size:.8rem;color:#aaa}
-        .stat-item .value{font-size:1.3rem;font-weight:600;color:#fff}
+        .stat-box{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:12px;margin-bottom:16px;align-items:stretch}
+        .stat-item{min-width:0;min-height:76px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;background:#151a2a;padding:12px 10px;border-radius:10px;text-align:center;border:1px solid #2a3152}
+        .stat-item .label{font-size:.8rem;color:#aaa;line-height:1.25;max-width:100%}
+        .stat-item .value{font-size:1.25rem;font-weight:600;color:#fff;line-height:1.3;min-height:1.35em;display:flex;align-items:center;justify-content:center}
         .grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
         .card{background:#121726;border-radius:10px;padding:12px;border:1px solid #2a3150}
         .full{grid-column:1/-1}
@@ -82,7 +82,7 @@
         .order-card{grid-column:2}
         .records-card{grid-column:1/-1}
         .review-card{grid-column:1/-1}
-        @media (min-width: 1280px){
+        @media (min-width: 1440px){
             .monitor-card .list,.order-card .list{max-height:420px}
             .records-card .table-wrap{max-height:620px;overflow:auto}
         }
@@ -94,12 +94,12 @@
         @media (max-width: 960px){
             body{padding:10px}
             .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
-            .stat-item{min-width:130px}
+            .stat-box{grid-template-columns:repeat(2,minmax(0,1fr))}
         }
         .stats-detail{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin-top:10px}
-        .stats-detail .stat-item{min-width:0;text-align:left;padding:10px 12px}
+        .stats-detail .stat-item{min-width:0;min-height:0;display:block;text-align:left;padding:10px 12px;align-items:stretch;gap:4px}
         .stats-detail .stat-item .label{font-size:.75rem}
-        .stats-detail .stat-item .value{font-size:1.05rem;word-break:break-all}
+        .stats-detail .stat-item .value{min-height:0;display:block;font-size:1.05rem;word-break:break-all}
         .export-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px;font-size:.85rem}
         .export-bar a{color:#8fc8ff;text-decoration:none;padding:6px 10px;border:1px solid #304164;border-radius:8px;background:#151a2a}
         .export-bar a:hover{background:#1f2740}