Update app.py

app.py

@@ -79,7 +79,7 @@ def chat_logic(message, history, system_prompt, context, max_tokens, temperature
     return "", history
 
 # ==========================================
-# 3. UI DESIGN (FINAL ENGLISH VERSION)
+# 3. UI DESIGN (CLEANEST VERSION)
 # ==========================================
 
 CSS = """
@@ -95,7 +95,7 @@ CSS = """
     --block-border-color: transparent !important;
     --input-background-fill: #ffffff !important;
     
-    /* KILL PURPLE/BLUE COLORS */
+    /* COLORS */
     --primary-500: #000000 !important;
     --primary-600: #000000 !important;
     --secondary-500: #000000 !important;
@@ -109,6 +109,11 @@ body {
     min-height: 100vh;
 }
 
+/* HIDE GRADIO FOOTER (The buttons at the bottom) */
+footer {
+    display: none !important;
+}
+
 h1 { font-weight: 700 !important; color: #000000 !important; letter-spacing: -0.02em; }
 p, span, label { color: #374151 !important; }
 
@@ -129,7 +134,7 @@ p, span, label { color: #374151 !important; }
     box-shadow: none !important;
 }
 
-/* Labels: Black Text */
+/* Labels */
 .config-card label span, 
 .config-card .label-wrap span,
 .config-card .block-title {
@@ -143,7 +148,7 @@ p, span, label { color: #374151 !important; }
     padding: 0 !important;
 }
 
-/* Inputs: White Background */
+/* Inputs */
 .config-card textarea, 
 .config-card input[type="text"], 
 .config-card input[type="number"] {
@@ -154,7 +159,7 @@ p, span, label { color: #374151 !important; }
     box-shadow: 0 1px 2px rgba(0,0,0,0.05) !important;
 }
 
-/* Sliders: Black */
+/* Sliders */
 input[type=range] {
     accent-color: #000000 !important;
     filter: grayscale(100%) brightness(0) !important;
@@ -187,20 +192,16 @@ input[type=range] {
 }
 
 /* --- CHAT BUBBLES --- */
-
-/* User: Black Background + WHITE TEXT */
 .message.user {
     background-color: #000000 !important;
-    color: #ffffff !important; /* FORCED WHITE TEXT */
+    color: #ffffff !important;
     border-radius: 18px 18px 4px 18px !important;
     font-weight: 500;
 }
-/* Ensure inner text elements are white */
 .message.user p, .message.user span, .message.user div {
     color: #ffffff !important;
 }
 
-/* Bot: White Background + Black Text */
 .message.bot {
     background-color: #ffffff !important;
     color: #000000 !important;
@@ -209,7 +210,7 @@ input[type=range] {
     box-shadow: 0 2px 5px rgba(0,0,0,0.02);
 }
 
-/* --- INPUT BOX WITH SCROLLBAR ("SLICER") --- */
+/* --- INPUT BOX --- */
 .chat-input-area {
     padding: 16px 24px 24px 24px;
     display: flex; gap: 10px; align-items: flex-end;
@@ -220,14 +221,11 @@ input[type=range] {
     padding: 12px 18px !important;
     border: 1px solid #e5e7eb !important;
     color: #000000 !important;
-    
-    /* SCROLLBAR MAGIC */
-    max-height: 120px !important;  /* Max height before scrolling */
-    overflow-y: auto !important;   /* Enable scrollbar */
+    max-height: 120px !important;
+    overflow-y: auto !important;
     border-radius: 24px !important;
 }
 
-/* Send Arrow Button */
 #send-btn {
     background: transparent !important;
     color: #000000 !important;
@@ -242,13 +240,6 @@ input[type=range] {
     transform: translateX(3px);
     color: #333;
 }
-
-/* Logos */
-.trusted-logos {
-    opacity: 0.6; filter: grayscale(100%);
-    margin-top: 30px; display: flex; gap: 20px;
-    font-weight: 600; font-size: 1.1rem; color: #4b5563;
-}
 """
 
 WINDOW_HEADER = """
@@ -260,18 +251,6 @@ WINDOW_HEADER = """
 </div>
 """
 
-TRUSTED_SECTION = """
-<div style="margin-top: 40px;">
-    <p style="font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #9ca3af; margin-bottom: 10px;">Trusted by</p>
-    <div class="trusted-logos">
-        <span>Pingdom</span>
-        <span>prismic</span>
-        <span>Unsplash</span>
-        <span>krisp</span>
-    </div>
-</div>
-"""
-
 with gr.Blocks(theme=gr.themes.Soft(), css=CSS, title="Custom AI") as demo:
     
     with gr.Row(elem_id="main-container"):
@@ -280,13 +259,15 @@ with gr.Blocks(theme=gr.themes.Soft(), css=CSS, title="Custom AI") as demo:
         with gr.Column(scale=4):
             gr.Markdown(
                 """
-                # MX Iris AI Chatbot
+                # Custom AI Chatbot
+                # trained on your data
                 
+                Customize the behavior and context of your assistant right here.
                 """
             )
             
             with gr.Group(elem_classes="config-card"):
-                gr.Markdown("### Settings")
+                gr.Markdown("### ⚙️ Settings")
                 
                 context_input = gr.Textbox(
                     label="Context (Data)",
@@ -305,8 +286,8 @@ with gr.Blocks(theme=gr.themes.Soft(), css=CSS, title="Custom AI") as demo:
                     tokens_slider = gr.Slider(64, 1024, value=256, step=64, label="Max Tokens")
                 
                 top_p_slider = gr.Slider(0.1, 1.0, value=0.9, step=0.05, label="Top-P")
-
-            gr.HTML(TRUSTED_SECTION)
+            
+            # (Trusted section removed)
 
         # --- RIGHT PANEL ---
         with gr.Column(scale=6):
@@ -338,4 +319,4 @@ with gr.Blocks(theme=gr.themes.Soft(), css=CSS, title="Custom AI") as demo:
     send_btn.click(chat_logic, inputs_list, [msg, chatbot])
 
 if __name__ == "__main__":
-    demo.launch()
+    demo.launch(show_api=False, show_footer=False)