Update Gradio_UI.py

Gradio_UI.py

@@ -6,7 +6,42 @@ class GradioUI:
         self.interface = self._create_interface()
 
     def _create_interface(self):
-        with gr.Blocks(title="Landsat Image Fetcher") as demo:
+        # Define custom CSS to hide the resize arrows and style the output
+        custom_css = """
+        /* Hide the resize arrows */
+        .output-container .svelte-1g9btlg { display: none !important; }
+        
+        /* Style the output panel */
+        #output-panel {
+            height: 400px !important;  /* Fixed height */
+            overflow-y: auto;          /* Add scrollbar if content overflows */
+            border: 1px solid #ccc;    /* Add a subtle border */
+            border-radius: 5px;        /* Rounded corners */
+            padding: 10px;             /* Inner padding */
+            background-color: #f9f9f9; /* Light background */
+        }
+        
+        /* Style the links */
+        #output-panel a {
+            color: #1a73e8;            /* Google-blue link color */
+            text-decoration: none;     /* Remove underline */
+            font-weight: bold;         /* Bold links */
+        }
+        #output-panel a:hover {
+            text-decoration: underline; /* Underline on hover */
+        }
+        
+        /* Style the list items */
+        #output-panel ul {
+            list-style-type: none;     /* Remove default bullets */
+            padding-left: 0;           /* Remove default padding */
+        }
+        #output-panel li {
+            margin-bottom: 10px;       /* Space between list items */
+        }
+        """
+
+        with gr.Blocks(title="Landsat Image Fetcher", css=custom_css) as demo:
             gr.Markdown("# Landsat Image Fetcher")
             gr.Markdown("Enter coordinates and a time range to fetch Landsat images from USGS.")
             with gr.Row():
@@ -19,7 +54,7 @@ class GradioUI:
                     end_date = gr.Textbox(label="End Date (YYYY-MM-DD)", value="2023-12-31")
                     submit_btn = gr.Button("Fetch Images")
                 with gr.Column():
-                    output = gr.HTML(label="Download Links")
+                    output = gr.HTML(label="Download Links", elem_id="output-panel")
             submit_btn.click(
                 fn=lambda lm, ln, lx, lo, sd, ed: self.agent.run(
                     f"fetch_landsat_image({lm}, {ln}, {lx}, {lo}, '{sd}', '{ed}')"