Update app.py

app.py

@@ -14,6 +14,7 @@ def chat_fn(message, history):
         if isinstance(h, (list, tuple)):
             if h[0]: messages.append({"role": "user", "content": str(h[0])})
             if h[1]: messages.append({"role": "assistant", "content": str(h[1])})
+    
     messages.append({"role": "user", "content": str(message)})
     response = ""
     try:
@@ -27,74 +28,65 @@ def chat_fn(message, history):
 
 # 2. Das "Clean & Ultra-Round" Design
 custom_css = """
-/* Hintergrund: Sehr helles Cloud-Blau */
-.gradio-container { 
-    background-color: #f4f9ff !important; 
-}
+/* Hintergrund: Cloud-Blau */
+.gradio-container { background-color: #f4f9ff !important; }
 
-/* Entfernt die hintere/doppelte Leiste im Eingabebereich */
-.gr-box, .form { 
+/* Entfernt die doppelte Leiste/Box hinter dem Input */
+.form, .gr-box { 
     border: none !important; 
-    background: transparent !important;
-    box-shadow: none !important;
+    background: transparent !important; 
+    box-shadow: none !important; 
 }
 
-/* Chat-Fenster: Extrem rund, weiß und schwebend */
+/* Chat-Fenster: Extra rund, weiß & heller Bereich */
 .chatbot { 
     border-radius: 50px !important; 
     border: none !important; 
     background-color: #ffffff !important;
     box-shadow: 0 8px 30px rgba(0,0,0,0.05) !important;
-    margin-bottom: 25px !important;
 }
 
-/* Textfarben im Chat: Tiefschwarz */
-.chatbot p, .chatbot span { 
+/* Textfarben: Echtes Tiefschwarz */
+.chatbot p, .chatbot span, .chatbot div { 
     color: #000000 !important; 
 }
 
-/* Eingabefeld: Ganz schwarz geschriebener Text */
+/* Eingabefeld: Pillen-Design */
 #input-box textarea {
     border-radius: 50px !important;
     border: 2px solid #3b82f6 !important;
     padding: 15px 30px !important;
     background-color: #ffffff !important;
     color: #000000 !important;
-    font-size: 16px !important;
 }
 
-/* Placeholder (Grauer Text wenn leer) */
-#input-box textarea::placeholder {
-    color: #9ca3af !important;
-}
+/* Platzhalter Text (Leicht grau) */
+#input-box textarea::placeholder { color: #9ca3af !important; }
 
-/* Senden-Button (Rund & Blau) */
+/* Abschickbutton: Rund & Blau */
 button.primary {
     border-radius: 50px !important;
     background-color: #3b82f6 !important;
     color: white !important;
     font-weight: bold !important;
-    border: none !important;
-    height: 50px !important;
 }
 
+/* Verstecke alle ungewollten Gradio-Standard-Buttons über CSS */
 footer { display: none !important; }
+.clear-common { display: none !important; }
 """
 
 with gr.Blocks(title="CocoAi Smooth") as demo:
-    # Header
     with gr.Column():
         gr.HTML("<div style='text-align: center; padding: 15px;'>")
         gr.Markdown("# <span style='color: #1e40af; font-size: 36px;'>🐱 CocoAi</span>")
-        gr.Markdown("<p style='color: #000000; font-size: 18px;'>Intelligent • Loyal • CocoEntertainment</p>")
+        gr.Markdown("<p style='color: #000000; font-size: 18px; font-weight: bold;'>Intelligent • Loyal • CocoEntertainment</p>")
         gr.HTML("</div>")
     
-    # Interface mit Gradio 6 Parametern
+    # Minimalistisches ChatInterface - Buttons werden via CSS ausgeblendet
     gr.ChatInterface(
         fn=chat_fn,
         submit_btn="Abschicken",
-        show_clear_button=False,  # Korrekter Name für Gradio 6
-        show_stop_button=False,
         textbox=gr.Textbox(
             placeholder="Frag CocoAi etwas...", 
             container=False, 
@@ -106,8 +98,5 @@ with gr.Blocks(title="CocoAi Smooth") as demo:
 if __name__ == "__main__":
     demo.launch(
         css=custom_css,
-        theme=gr.themes.Soft(
-            primary_hue="blue", 
-            radius_size="xxl"
-        )
+        theme=gr.themes.Soft(primary_hue="blue", radius_size="xxl")
     )