Spaces:
Sleeping
Sleeping
Commit
•
861dde3
1
Parent(s):
6f5d54a
Update app.py
Browse files
app.py
CHANGED
@@ -99,32 +99,6 @@ css = """
|
|
99 |
background-color: #0056b3; /* Darken the background color on hover */
|
100 |
}
|
101 |
|
102 |
-
/* Custom CSS */
|
103 |
-
.gradio-container {
|
104 |
-
font-family: 'IBM Plex Sans', sans-serif;
|
105 |
-
max-width: 900px;
|
106 |
-
margin: auto;
|
107 |
-
padding: 2rem;
|
108 |
-
border-radius: 15px;
|
109 |
-
box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
|
110 |
-
text-align: center; /* Center the content horizontally */
|
111 |
-
}
|
112 |
-
|
113 |
-
/* Button Styles */
|
114 |
-
.gr-button {
|
115 |
-
color: white;
|
116 |
-
background-color: #007bff; /* Use a primary color for the background */
|
117 |
-
border: none;
|
118 |
-
padding: 10px 20px;
|
119 |
-
border-radius: 8px;
|
120 |
-
cursor: pointer;
|
121 |
-
transition: background-color 0.3s, color 0.3s;
|
122 |
-
}
|
123 |
-
|
124 |
-
.gr-button:hover {
|
125 |
-
background-color: #0056b3; /* Darken the background color on hover */
|
126 |
-
}
|
127 |
-
|
128 |
/* Textbox Styles */
|
129 |
.gr-textbox {
|
130 |
border-radius: 8px;
|
@@ -141,16 +115,23 @@ css = """
|
|
141 |
/* Gallery Styles */
|
142 |
#gallery {
|
143 |
display: flex;
|
|
|
144 |
justify-content: center;
|
145 |
align-items: center;
|
146 |
margin-top: 2rem;
|
147 |
}
|
148 |
|
149 |
-
/*
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
150 |
#gallery img {
|
151 |
-
|
152 |
-
|
153 |
-
margin: 1rem 0; /* Add vertical spacing between images */
|
154 |
border-radius: 10px;
|
155 |
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
|
156 |
}
|
|
|
99 |
background-color: #0056b3; /* Darken the background color on hover */
|
100 |
}
|
101 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
102 |
/* Textbox Styles */
|
103 |
.gr-textbox {
|
104 |
border-radius: 8px;
|
|
|
115 |
/* Gallery Styles */
|
116 |
#gallery {
|
117 |
display: flex;
|
118 |
+
flex-direction: column; /* Stack images vertically */
|
119 |
justify-content: center;
|
120 |
align-items: center;
|
121 |
margin-top: 2rem;
|
122 |
}
|
123 |
|
124 |
+
/* Set a fixed size for the image container */
|
125 |
+
.image-container {
|
126 |
+
width: 300px; /* Set the desired width for the image container */
|
127 |
+
height: 200px; /* Set the desired height for the image container */
|
128 |
+
overflow: hidden; /* Hide overflow if the image is larger */
|
129 |
+
}
|
130 |
+
|
131 |
+
/* Set a fixed size for the image */
|
132 |
#gallery img {
|
133 |
+
width: 100%;
|
134 |
+
height: 100%;
|
|
|
135 |
border-radius: 10px;
|
136 |
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
|
137 |
}
|