Update app.py
Browse files
app.py
CHANGED
|
@@ -1271,6 +1271,71 @@ def main_ui():
|
|
| 1271 |
title="AI Image Generator",
|
| 1272 |
theme=gr.themes.Base(),
|
| 1273 |
css="""
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1274 |
.info-box {
|
| 1275 |
background-color: #f8f4f0;
|
| 1276 |
padding: 15px;
|
|
|
|
| 1271 |
title="AI Image Generator",
|
| 1272 |
theme=gr.themes.Base(),
|
| 1273 |
css="""
|
| 1274 |
+
/* ===== INFO-BOXEN über Textboxen ===== */
|
| 1275 |
+
.info-box {
|
| 1276 |
+
background: #f8fafc;
|
| 1277 |
+
padding: 12px 15px;
|
| 1278 |
+
border-radius: 8px;
|
| 1279 |
+
border: 2px solid #e2e8f0;
|
| 1280 |
+
margin-bottom: 10px;
|
| 1281 |
+
font-size: 14px;
|
| 1282 |
+
line-height: 1.4;
|
| 1283 |
+
}
|
| 1284 |
+
|
| 1285 |
+
/* Linke Box (Prompt) - Blau */
|
| 1286 |
+
.gr-column:first-child .info-box {
|
| 1287 |
+
border-left: 4px solid #3b82f6;
|
| 1288 |
+
background: #eff6ff;
|
| 1289 |
+
}
|
| 1290 |
+
|
| 1291 |
+
/* Rechte Box (Negativ) - Rot */
|
| 1292 |
+
.gr-column:last-child .info-box {
|
| 1293 |
+
border-left: 4px solid #ef4444;
|
| 1294 |
+
background: #fef2f2;
|
| 1295 |
+
}
|
| 1296 |
+
|
| 1297 |
+
/* Code in Info-Boxen */
|
| 1298 |
+
.info-box code {
|
| 1299 |
+
background: white;
|
| 1300 |
+
padding: 3px 6px;
|
| 1301 |
+
border-radius: 4px;
|
| 1302 |
+
font-family: monospace;
|
| 1303 |
+
font-size: 13px;
|
| 1304 |
+
border: 1px solid #e2e8f0;
|
| 1305 |
+
display: inline-block;
|
| 1306 |
+
margin: 3px 0;
|
| 1307 |
+
}
|
| 1308 |
+
|
| 1309 |
+
/* Kleiner Hinweistext */
|
| 1310 |
+
.info-box small {
|
| 1311 |
+
color: #64748b;
|
| 1312 |
+
font-size: 11px;
|
| 1313 |
+
display: block;
|
| 1314 |
+
margin-top: 5px;
|
| 1315 |
+
}
|
| 1316 |
+
|
| 1317 |
+
/* ===== TEXTBOXEN ===== */
|
| 1318 |
+
.prompt-box textarea {
|
| 1319 |
+
min-height: 90px !important;
|
| 1320 |
+
border-radius: 6px !important;
|
| 1321 |
+
border: 2px solid #e2e8f0 !important;
|
| 1322 |
+
padding: 10px !important;
|
| 1323 |
+
font-size: 14px !important;
|
| 1324 |
+
}
|
| 1325 |
+
|
| 1326 |
+
/* Focus-State */
|
| 1327 |
+
.prompt-box textarea:focus {
|
| 1328 |
+
border-color: #3b82f6 !important;
|
| 1329 |
+
outline: none !important;
|
| 1330 |
+
box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.1) !important;
|
| 1331 |
+
}
|
| 1332 |
+
|
| 1333 |
+
/* Platzhalter */
|
| 1334 |
+
.prompt-box textarea::placeholder {
|
| 1335 |
+
color: #94a3b8 !important;
|
| 1336 |
+
}
|
| 1337 |
+
|
| 1338 |
+
|
| 1339 |
.info-box {
|
| 1340 |
background-color: #f8f4f0;
|
| 1341 |
padding: 15px;
|