Update app.py

app.py

@@ -99,32 +99,6 @@ css = """
     background-color: #0056b3; /* Darken the background color on hover */
 }
 
-/* Custom CSS */
-.gradio-container {
-    font-family: 'IBM Plex Sans', sans-serif;
-    max-width: 900px;
-    margin: auto;
-    padding: 2rem;
-    border-radius: 15px;
-    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
-    text-align: center; /* Center the content horizontally */
-}
-
-/* Button Styles */
-.gr-button {
-    color: white;
-    background-color: #007bff; /* Use a primary color for the background */
-    border: none;
-    padding: 10px 20px;
-    border-radius: 8px;
-    cursor: pointer;
-    transition: background-color 0.3s, color 0.3s;
-}
-
-.gr-button:hover {
-    background-color: #0056b3; /* Darken the background color on hover */
-}
-
 /* Textbox Styles */
 .gr-textbox {
     border-radius: 8px;
@@ -141,16 +115,23 @@ css = """
 /* Gallery Styles */
 #gallery {
     display: flex;
+    flex-direction: column; /* Stack images vertically */
     justify-content: center;
     align-items: center;
     margin-top: 2rem;
 }
 
-/* Automatically adjust photo size */
+/* Set a fixed size for the image container */
+.image-container {
+    width: 300px; /* Set the desired width for the image container */
+    height: 200px; /* Set the desired height for the image container */
+    overflow: hidden; /* Hide overflow if the image is larger */
+}
+
+/* Set a fixed size for the image */
 #gallery img {
-    max-width: 50%;
-    max-height: 50px; /* Thay đổi giới hạn chiều cao của ảnh theo mong muốn */
-    margin: 1rem 0; /* Add vertical spacing between images */
+    width: 100%;
+    height: 100%;
     border-radius: 10px;
     box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
 }