2025-08-01 09:34 🚀

app.py

@@ -576,7 +576,11 @@ select option[value*="━━━━━━"] {
         position: static !important;
     }
     
-    .gr-row:nth-of-type(3) .gr-button {
+    .gr-row:nth-of-type(3) .gr-column:first-child .gr-group {
+        position: static !important;
+    }
+    
+    .gr-row:nth-of-type(3) .gr-column:first-child .gr-button {
         position: static !important;
         bottom: auto !important;
         left: auto !important;
@@ -615,7 +619,11 @@ select option[value*="━━━━━━"] {
         position: static !important;
     }
     
-    .gr-row:nth-of-type(3) .gr-button {
+    .gr-row:nth-of-type(3) .gr-column:first-child .gr-group {
+        position: static !important;
+    }
+    
+    .gr-row:nth-of-type(3) .gr-column:first-child .gr-button {
         position: static !important;
         bottom: auto !important;
         left: auto !important;
@@ -665,7 +673,11 @@ select option[value*="━━━━━━"] {
         position: static !important;
     }
     
-    .gr-row:nth-of-type(3) .gr-button {
+    .gr-row:nth-of-type(3) .gr-column:first-child .gr-group {
+        position: static !important;
+    }
+    
+    .gr-row:nth-of-type(3) .gr-column:first-child .gr-button {
         position: static !important;
         bottom: auto !important;
         left: auto !important;
@@ -796,13 +808,13 @@ select option[value*="━━━━━━"] {
     transform: translateY(-2px) !important;
 }
 
-/* 确保第二行组件等高 */
+/* 确保第二行组件等高 - 重新调整为三列等宽 */
 .gr-row:nth-of-type(2) .gr-group {
-    height: 240px !important;
-    min-height: 240px !important;
+    height: 180px !important;
+    min-height: 180px !important;
     display: flex !important;
     flex-direction: column !important;
-    justify-content: space-between !important;
+    justify-content: center !important;
 }
 
 .gr-row:nth-of-type(2) .gr-group > * {
@@ -823,10 +835,10 @@ select option[value*="━━━━━━"] {
     max-height: 80px !important;
 }
 
-/* 确保第三行组件等高 */
+/* 确保第三行组件等高 - 重新调整高度 */
 .gr-row:nth-of-type(3) .gr-group {
-    height: 480px !important;
-    min-height: 480px !important;
+    height: 520px !important;
+    min-height: 520px !important;
     display: flex !important;
     flex-direction: column !important;
     justify-content: flex-start !important;
@@ -834,18 +846,18 @@ select option[value*="━━━━━━"] {
 
 /* 第三行的图像容器统一高度 */
 .gr-row:nth-of-type(3) .gr-image {
-    height: 380px !important;
-    min-height: 380px !important;
-    max-height: 380px !important;
-    flex: 0 0 380px !important;
+    height: 400px !important;
+    min-height: 400px !important;
+    max-height: 400px !important;
+    flex: 0 0 400px !important;
 }
 
-/* 第三行的按钮固定在底部 */
-.gr-row:nth-of-type(3) .gr-group {
+/* 第三行的按钮固定在底部 - 只对第一列（Image Input）应用 */
+.gr-row:nth-of-type(3) .gr-column:first-child .gr-group {
     position: relative !important;
 }
 
-.gr-row:nth-of-type(3) .gr-button {
+.gr-row:nth-of-type(3) .gr-column:first-child .gr-button {
     position: absolute !important;
     bottom: 24px !important;
     left: 24px !important;
@@ -860,13 +872,9 @@ select option[value*="━━━━━━"] {
     margin-bottom: 16px !important;
 }
 
-/* 第二行特殊布局调整 */
-.gr-row:nth-of-type(2) .gr-column:first-child {
-    padding-right: 12px !important;
-}
-
-.gr-row:nth-of-type(2) .gr-column:last-child {
-    padding-left: 12px !important;
+/* 第二行特殊布局调整 - 移除，现在是三列等宽 */
+.gr-row:nth-of-type(2) .gr-column {
+    padding: 0 8px !important;
 }
 
 /* 标签美化 */
@@ -924,25 +932,7 @@ select option[value*="━━━━━━"] {
     height: 100% !important;
 }
 
-/* 第二行内部子行等高处理 */
-.gr-row:nth-of-type(2) .gr-group .gr-row {
-    height: 100% !important;
-    align-items: stretch !important;
-    flex: 1 !important;
-}
-
-.gr-row:nth-of-type(2) .gr-group .gr-row .gr-column {
-    display: flex !important;
-    flex-direction: column !important;
-    justify-content: space-between !important;
-    height: 100% !important;
-}
-
-/* 第二行内部markdown标题固定高度 */
-.gr-row:nth-of-type(2) .gr-group .gr-markdown {
-    flex: 0 0 auto !important;
-    margin-bottom: 16px !important;
-}
+/* 第二行内部子行等高处理 - 移除，现在不需要内部子行 */
 
 /* 统计信息卡片美化 */
 .gr-textbox[label*="Count"] {
@@ -1020,34 +1010,31 @@ with gr.Blocks(css=css, theme=gr.themes.Soft(), title="ZIP Crowd Counting") as d
         Choose from different model variants: **ZIP-B** (Base), **ZIP-S** (Small), **ZIP-T** (Tiny), **ZIP-N** (Nano), **ZIP-P** (Pico)
         """)
 
-    # 第二行：模型配置区域（2/3宽度）和预测结果（1/3宽度）
+    # 第二行：模型配置、状态和预测结果（三列等宽）
     with gr.Row():
-        with gr.Column(scale=2):
+        with gr.Column(scale=1):
+            with gr.Group():
+                model_dropdown = gr.Dropdown(
+                    choices=pretrained_models,
+                    value="ZIP-B @ NWPU-Crowd @ MAE",
+                    label="🎛️ Select Model & Dataset",
+                    info="Choose model variant, dataset, and evaluation metric"
+                )
+        
+        with gr.Column(scale=1):
             with gr.Group():
-                gr.Markdown("### 🤖 Model Configuration")
-                with gr.Row():
-                    with gr.Column(scale=1):
-                        model_dropdown = gr.Dropdown(
-                            choices=pretrained_models,
-                            value="ZIP-B @ NWPU-Crowd @ MAE",
-                            label="🎛️ Select Model & Dataset",
-                            info="Choose model variant, dataset, and evaluation metric"
-                        )
-                    
-                    with gr.Column(scale=1):
-                        model_status = gr.Textbox(
-                            label="📊 Model Status",
-                            value="🔄 No model loaded",
-                            interactive=False,
-                            elem_classes=["status-display"],
-                            lines=3
-                        )
+                model_status = gr.Textbox(
+                    label="📊 Model Status",
+                    value="🔄 No model loaded",
+                    interactive=False,
+                    elem_classes=["status-display"],
+                    lines=3
+                )
         
         with gr.Column(scale=1):
             with gr.Group():
-                gr.Markdown("### 🧙 Predicted Count")
                 output_text = gr.Textbox(
-                    label="Result",
+                    label="🧙 Predicted Count",
                     value="",
                     interactive=False,
                     info="Total number of people detected",
@@ -1058,9 +1045,8 @@ with gr.Blocks(css=css, theme=gr.themes.Soft(), title="ZIP Crowd Counting") as d
     with gr.Row():
         with gr.Column(scale=1):
             with gr.Group():
-                gr.Markdown("### 📸 Image Input")
                 input_img = gr.Image(
-                    label="🖼️ Upload Image", 
+                    label="📸 Upload Image", 
                     sources=["upload", "clipboard"], 
                     type="pil",
                     height=400
@@ -1073,7 +1059,6 @@ with gr.Blocks(css=css, theme=gr.themes.Soft(), title="ZIP Crowd Counting") as d
         
         with gr.Column(scale=1):
             with gr.Group():
-                gr.Markdown("### 📊 Main Results")
                 output_den_map = gr.Image(
                     label="🎯 Predicted Density Map", 
                     type="pil", 
@@ -1082,7 +1067,6 @@ with gr.Blocks(css=css, theme=gr.themes.Soft(), title="ZIP Crowd Counting") as d
         
         with gr.Column(scale=1):
             with gr.Group():
-                gr.Markdown("### 🔥 Hotspots")
                 output_lambda_map = gr.Image(
                     label="📈 Lambda Map", 
                     type="pil",