调整均线显示位置

web/templates/index.html

@@ -291,25 +291,41 @@
         .ma-indicators {
             position: absolute;
             top: 10px;
-            left: 10px;
+            left: 0;
             z-index: 100;
             background-color: rgba(255, 255, 255, 0.95);
             padding: 8px 12px;
-            border-radius: 6px;
+            border-radius: 0 6px 6px 0;
             box-shadow: 0 2px 8px rgba(0,0,0,0.1);
             max-width: calc(100% - 200px);
+            border-left: none;
+        }
+        
+        .ma-indicators .d-flex {
+            flex-direction: column;
+            align-items: flex-start;
+            gap: 4px;
+        }
+        
+        .ma-indicators .d-flex .d-flex {
+            flex-direction: row;
+            align-items: center;
+            gap: 8px;
         }
         
         .ma-indicator-item {
-            display: inline-flex;
+            display: flex;
+            flex-direction: row;
             align-items: center;
-            gap: 4px;
+            gap: 8px;
-            padding: 2px 6px;
+            padding: 4px 8px;
             border-radius: 4px;
             font-size: 12px;
             font-weight: 500;
             background-color: rgba(0,0,0,0.05);
             border: 1px solid rgba(0,0,0,0.1);
+            width: 100%;
+            box-sizing: border-box;
         }
         
         .ma-indicator-color {
@@ -320,10 +336,13 @@
         
         .ma-indicator-controls {
             display: flex;
-            margin-left: 4px;
+            flex-direction: row;
+            margin-top: 2px;
             gap: 2px;
             opacity: 0.6;
             transition: opacity 0.3s ease;
+            width: 100%;
+            justify-content: flex-end;
         }
         
         .ma-indicator-item:hover .ma-indicator-controls {
@@ -600,9 +619,8 @@
         <div class="chart-container">
             <!-- 均线显示区域 -->
             <div id="movingAverageIndicators" class="ma-indicators" style="display: none;">
-                <div class="d-flex flex-wrap gap-2 align-items-center">
+                <div class="d-flex flex-column gap-2 align-items-start">
-                    <span class="text-muted small">均线:</span>
+                    <div id="maIndicatorsList" class="d-flex flex-column gap-2"></div>
-                    <div id="maIndicatorsList" class="d-flex flex-wrap gap-2"></div>
                 </div>
             </div>
             <div id="tradingview_chart"></div>