Update app.py

app.py

@@ -107,7 +107,11 @@ def chatbot_interface(user_message, history):
 
 # Define Gradio Interface
 with gr.Blocks(css="""
-    .gradio-container { 
+    /* Import Raleway font from Google Fonts */
+    @import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;600&display=swap');
+
+    body, .gradio-container { 
+        font-family: 'Raleway', sans-serif; 
         background-color: #ece5dd; 
         padding: 20px;
     }
@@ -117,24 +121,27 @@ with gr.Blocks(css="""
         background-color: #ffffff; 
         border-radius: 10px; 
         padding: 10px;
+        font-size: 16px;
     }
     #textbox { 
-        width: 100%; 
+        width: 80%; 
         padding: 10px; 
         border-radius: 20px; 
         border: 1px solid #ccc;
         outline: none;
+        font-size: 16px;
     }
     #send-button { 
         background-color: #128c7e; 
         color: white; 
-        padding: 10px 20px; 
+        padding: 10px; 
         border: none; 
         border-radius: 50%; 
         cursor: pointer;
         margin-left: 10px;
         width: 50px;
         height: 50px;
+        font-size: 20px;
     }
     #send-button:hover { 
         background-color: #075e54; 
@@ -147,24 +154,14 @@ with gr.Blocks(css="""
         border-radius: 5px; 
         cursor: pointer;
         margin-top: 10px;
+        font-size: 14px;
     }
     #clear-button:hover { 
         background-color: #128c7e; 
     }
-    #timezone-dropdown { 
-        margin-top: 10px; 
-    }
     .message { 
         margin-bottom: 10px; 
     }
-    .user-message { 
-        text-align: right; 
-        color: #333;
-    }
-    .ai-message { 
-        text-align: left; 
-        color: #555;
-    }
     /* Scrollbar Styling */
     #chatbot::-webkit-scrollbar {
         width: 8px;
@@ -185,16 +182,20 @@ with gr.Blocks(css="""
         with gr.Column(scale=1):
             chatbot = gr.Chatbot(label="Chatbot", elem_id="chatbot", type="messages")
         with gr.Column(scale=1):
-            msg = gr.Textbox(
-                placeholder="Type your message here...",
-                show_label=False,
-                container=False,
-                elem_id="textbox"
-            )
-            send = gr.Button("➤", elem_id="send-button")
-            clear = gr.Button("Clear Chat", elem_id="clear-button")
+            with gr.Row():
+                msg = gr.Textbox(
+                    placeholder="Type your message here...",
+                    show_label=False,
+                    container=False,
+                    elem_id="textbox"
+                )
+                send = gr.Button("➤", elem_id="send-button")
+            with gr.Row():
+                clear = gr.Button("Clear Chat", elem_id="clear-button")
     
     def update_chat(user_message, history):
+        if user_message.strip() == "":
+            return history, history  # Do not process empty messages
         history, updated_history = chatbot_interface(user_message, history)
         formatted_history = [
             format_message(msg['content'], is_user=(msg['role'] == 'user'))