Update app.py

app.py

@@ -151,20 +151,18 @@ def create_reranking_interface(task_data):
             ranking_inputs = []
             validation_indicators = []
             
-            # Add back the quick ranking tools with improved styling
-            # Add a nicely formatted header for the ranking tools
-            with gr.Box(elem_classes=["tool-container"]):
-                with gr.Row(equal_height=True):
-                    with gr.Column(scale=3):
-                        gr.Markdown("### Quick Ranking Tools", elem_classes=["section-header"])
-                    with gr.Column(scale=2):
-                        sequential_btn = gr.Button("Rank in Order (1,2,3...)", variant="secondary", size="sm")
-                    with gr.Column(scale=2):
-                        reverse_btn = gr.Button("Reverse Order (n,n-1,...)", variant="secondary", size="sm")
-                    with gr.Column(scale=2):
-                        clear_btn = gr.Button("Clear All Rankings", variant="secondary", size="sm")
-            
-            # Adjust the document display for more reasonable textbox size
+            # Add back the quick ranking tools with improved styling - more compact layout
+            with gr.Row(equal_height=True, elem_classes=["tool-row"]):
+                with gr.Column(scale=2):
+                    gr.Markdown("### Quick Tools:", elem_classes=["tool-heading"])
+                with gr.Column(scale=2):
+                    sequential_btn = gr.Button("1,2,3...", variant="secondary", size="sm")
+                with gr.Column(scale=2):
+                    reverse_btn = gr.Button("n,n-1...", variant="secondary", size="sm")
+                with gr.Column(scale=2):
+                    clear_btn = gr.Button("Clear All", variant="secondary", size="sm")
+            
+            # Make document textboxes much smaller
             with gr.Box():
                 for i, doc in enumerate(samples[0]["candidates"]):
                     row_class = "document-row-even" if i % 2 == 0 else "document-row-odd"
@@ -178,7 +176,7 @@ def create_reranking_interface(task_data):
                                 label=f"Document {i+1}",
                                 interactive=False,
                                 elem_classes=["document-text"],
-                                lines=4,  # Reduce to 4 visible lines
+                                lines=2,  # Reduce to only 2 visible lines
                             )
                             doc_containers.append(doc_box)
                         
@@ -222,24 +220,24 @@ def create_reranking_interface(task_data):
             
             .document-row {
                 border-bottom: 1px solid #e0e0e0;
-                padding: 12px 0;
-                margin-bottom: 8px !important;
+                padding: 8px 0;
+                margin-bottom: 4px !important;
             }
             
             .document-text textarea {
-                font-size: 16px !important;
-                line-height: 1.6 !important;
-                padding: 10px !important;
-                min-height: 100px !important;  /* Reduce minimum height */
+                font-size: 14px !important;
+                line-height: 1.4 !important;
+                padding: 6px !important;
+                min-height: 60px !important;  /* Dramatically reduce minimum height */
                 height: auto !important;       
                 overflow-y: visible !important;
             }
             
             .rank-dropdown select {
                 font-weight: bold !important;
-                font-size: 16px !important;
+                font-size: 14px !important;
                 text-align: center !important;
-                padding: 8px !important;
+                padding: 5px !important;
                 border-radius: 5px !important;
                 border: 2px solid #2c7be5 !important;
             }
@@ -250,10 +248,25 @@ def create_reranking_interface(task_data):
             }
             
             .tool-container {
-                margin-bottom: 20px !important;
+                margin-bottom: 10px !important;
                 background-color: #f8f9fa !important;
                 border-left: 4px solid #6c757d !important;
-                padding: 10px !important;
+                padding: 5px !important;
+            }
+            
+            .tool-row {
+                background-color: #f0f0f0 !important;
+                border-radius: 5px !important;
+                padding: 5px !important;
+                margin-bottom: 10px !important;
+                align-items: center !important;
+            }
+            
+            .tool-heading {
+                margin: 0 !important;
+                padding-top: 5px !important;
+                font-size: 16px !important;
+                font-weight: bold !important;
             }
             
             .section-header {
@@ -277,13 +290,14 @@ def create_reranking_interface(task_data):
                 display: flex;
                 align-items: center;
                 justify-content: center;
-                width: 30px;
-                height: 30px;
+                width: 25px;
+                height: 25px;
                 border-radius: 50%;
                 background-color: #2c7be5;
                 color: white;
                 font-weight: bold;
                 margin: 0 auto;
+                font-size: 12px !important;
             }
         </style>
         """)