From 1c449e2d97360de9278e4968208ca3fcfd0c2bf1 Mon Sep 17 00:00:00 2001
From: dekun <dekun@local>
Date: Thu, 21 May 2026 15:49:01 +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  | 13 ++++++++++++-
 crypto_monitor_gate/templates/index.html     | 13 ++++++++++++-
 crypto_monitor_gate_bot/templates/index.html | 13 ++++++++++++-
 crypto_monitor_okx/templates/index.html      | 13 ++++++++++++-
 4 files changed, 48 insertions(+), 4 deletions(-)

diff --git a/crypto_monitor_binance/templates/index.html b/crypto_monitor_binance/templates/index.html
index 710136a..e9dc102 100644
--- a/crypto_monitor_binance/templates/index.html
+++ b/crypto_monitor_binance/templates/index.html
@@ -6,7 +6,7 @@
     <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:1440px;width:100%;margin:0 auto;padding:0 8px}
+        .container{width:100%;max-width:min(1440px,94vw);margin:0 auto;padding:0 clamp(8px,1.5vw,20px)}
         .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}
@@ -95,6 +95,17 @@
             .panel-scroll,.pos-list{max-height:420px}
             .records-card .table-wrap{max-height:620px;overflow:auto}
         }
+        @media (min-width: 2200px){
+            .container{max-width:min(1720px,90vw)}
+        }
+        @media (min-width: 2560px){
+            .container{max-width:min(1860px,88vw)}
+            .dual-panel-grid{gap:18px}
+        }
+        @media (min-width: 3000px){
+            .container{max-width:min(1980px,86vw)}
+            .pos-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
+        }
         @media (max-width: 1100px){
             .grid{grid-template-columns:1fr}
             .dual-panel-grid{grid-template-columns:1fr}
diff --git a/crypto_monitor_gate/templates/index.html b/crypto_monitor_gate/templates/index.html
index 93015b6..e80ca5b 100644
--- a/crypto_monitor_gate/templates/index.html
+++ b/crypto_monitor_gate/templates/index.html
@@ -6,7 +6,7 @@
     <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:1440px;width:100%;margin:0 auto;padding:0 8px}
+        .container{width:100%;max-width:min(1440px,94vw);margin:0 auto;padding:0 clamp(8px,1.5vw,20px)}
         .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}
@@ -95,6 +95,17 @@
             .panel-scroll,.pos-list{max-height:420px}
             .records-card .table-wrap{max-height:620px;overflow:auto}
         }
+        @media (min-width: 2200px){
+            .container{max-width:min(1720px,90vw)}
+        }
+        @media (min-width: 2560px){
+            .container{max-width:min(1860px,88vw)}
+            .dual-panel-grid{gap:18px}
+        }
+        @media (min-width: 3000px){
+            .container{max-width:min(1980px,86vw)}
+            .pos-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
+        }
         @media (max-width: 1100px){
             .grid{grid-template-columns:1fr}
             .dual-panel-grid{grid-template-columns:1fr}
diff --git a/crypto_monitor_gate_bot/templates/index.html b/crypto_monitor_gate_bot/templates/index.html
index e34dbd0..b6c9077 100644
--- a/crypto_monitor_gate_bot/templates/index.html
+++ b/crypto_monitor_gate_bot/templates/index.html
@@ -6,7 +6,7 @@
     <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:1440px;width:100%;margin:0 auto;padding:0 8px}
+        .container{width:100%;max-width:min(1440px,94vw);margin:0 auto;padding:0 clamp(8px,1.5vw,20px)}
         .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}
@@ -116,6 +116,17 @@
             .order-card .order-live-positions{max-height:420px}
             .records-card .table-wrap{max-height:620px;overflow:auto}
         }
+        @media (min-width: 2200px){
+            .container{max-width:min(1720px,90vw)}
+        }
+        @media (min-width: 2560px){
+            .container{max-width:min(1860px,88vw)}
+            .trade-panels-row{gap:18px}
+        }
+        @media (min-width: 3000px){
+            .container{max-width:min(1980px,86vw)}
+            .pos-grid,.plan-card-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
+        }
         @media (max-width: 1100px){
             .grid{grid-template-columns:1fr}
             .trade-dashboard,.records-card,.review-card{grid-column:auto}
diff --git a/crypto_monitor_okx/templates/index.html b/crypto_monitor_okx/templates/index.html
index d9a4da8..fcbb804 100644
--- a/crypto_monitor_okx/templates/index.html
+++ b/crypto_monitor_okx/templates/index.html
@@ -6,7 +6,7 @@
     <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:1440px;width:100%;margin:0 auto;padding:0 8px}
+        .container{width:100%;max-width:min(1440px,94vw);margin:0 auto;padding:0 clamp(8px,1.5vw,20px)}
         .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}
@@ -86,6 +86,17 @@
             .monitor-card .list,.order-card .list{max-height:420px}
             .records-card .table-wrap{max-height:620px;overflow:auto}
         }
+        @media (min-width: 2200px){
+            .container{max-width:min(1720px,90vw)}
+        }
+        @media (min-width: 2560px){
+            .container{max-width:min(1860px,88vw)}
+            .grid{gap:18px}
+        }
+        @media (min-width: 3000px){
+            .container{max-width:min(1980px,86vw)}
+            .pos-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
+        }
         @media (max-width: 1100px){
             .grid{grid-template-columns:1fr}
             .monitor-card,.order-card,.records-card,.review-card{grid-column:auto}