feat: hide gallery scrollbar

app.py

@@ -164,6 +164,34 @@ css="""
     margin: 0 auto;
     max-width: 960px;
 }
+
+#gallery-image img {
+    width: 100%;        /* match column width */
+    height: auto;       /* preserve aspect ratio */
+    object-fit: contain;
+}
+
+/* Hide thumbnails by default */
+#gallery-image .gallery-container .preview .thumbnails {
+    opacity: 0;
+    transition: opacity 0.3s ease-in-out;
+}
+
+/* Show thumbnails only when hovering over the gallery */
+#gallery-image:hover .gallery-container .preview .thumbnails {
+    opacity: 1;
+}
+
+/* Hide caption by default */
+.gallery-container .preview .caption {
+    opacity: 0;
+    transition: opacity 0.3s ease-in-out;
+}
+
+/* Show caption when hovering over #gallery-image */
+#gallery-image:hover .gallery-container .preview .caption {
+    opacity: 1;
+}
 """
 with gr.Blocks(css=css) as demo:
     with gr.Column(elem_id="col-container"):
@@ -186,7 +214,7 @@ with gr.Blocks(css=css) as demo:
             with gr.Column():
                 image_tar = gr.Gallery(
                     label="Outputs", show_label=True, format="png",
-                    columns=[3], rows=[3], height="auto",
+                    columns=[3], rows=[3], height="auto", elem_id="gallery-image",
                 )
         with gr.Accordion(label="Advanced Settings", open=False):
             src_guidance_scale = gr.Slider(value=1.0, minimum=0.0, maximum=15.0, label="src_guidance_scale", info="Source prompt CFG scale.")