file upload gallery

app.py

@@ -599,19 +599,20 @@ def display_image_gallery():
     """
     Display an image gallery from st.session_state['input_list'] in a scrollable container.
     Each image will be downsampled to 120px on the long side.
+    The container will be as wide as its containing Streamlit column and no more than 400px tall.
     """
     # Initialize the container
     con_image = st.empty()
     with con_image.container():
-        # Start the gallery HTML with a div that will create a horizontal scrolling effect
-        gallery_html = "<div style='display: flex; flex-wrap: nowrap; overflow-x: auto;'>"
+        # Start the gallery HTML with a div that will create a vertical scrolling effect
+        gallery_html = "<div style='display: flex; flex-wrap: wrap; overflow-y: auto; max-height: 400px;'>"
 
         # Loop through each image in the input list
         for image_path in st.session_state['input_list']:
             # Open the image
             img = Image.open(image_path)
             # Downsample the image to 120px on the long side
-            img.thumbnail((120, 120))
+            img.thumbnail((120, 120), Image.ANTIALIAS)
             
             # Convert the image to base64 for HTML embedding
             buffered = io.BytesIO()
@@ -620,8 +621,8 @@ def display_image_gallery():
 
             # Add each image to the gallery HTML
             gallery_html += f"""
-            <div style='padding: 5px;'>
-                <img src='data:image/jpeg;base64,{img_str}' alt='Image' style='height: 120px; margin-right: 10px;'>
+            <div style='padding: 5px; flex: 1 0 auto;'>
+                <img src='data:image/jpeg;base64,{img_str}' alt='Image' style='max-height: 120px; width: auto;'>
             </div>
             """