Update app.py

app.py

@@ -46,9 +46,10 @@ Make it a challenge to guess if you are an AI.
 * Be slightly curious, sometimes ask questions
 * Be respectful and polite if the user is polite; be rough if the user is rough
 """
+
 def generate_response(user_message, conversation_history):
-    current_time = get_current_local_time()
-    current_date = datetime.datetime.now()
+    current_time, now = get_current_local_time()
+    current_date = now
 
     system_message = generate_system_message(current_time, current_date)
 
@@ -88,7 +89,7 @@ with gr.Blocks(css="""
 
     body, .gradio-container { 
         font-family: 'Raleway', sans-serif; 
-        background-color: #ece5dd; 
+        background-color: #f5f5f5; 
         padding: 20px;
     }
     #chatbot { 
@@ -98,31 +99,37 @@ with gr.Blocks(css="""
         border-radius: 10px; 
         padding: 10px;
         font-size: 16px;
+        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
     }
     #textbox { 
-        width: 95%; 
-        border-radius: 20px; 
+        width: 100%; 
+        border-radius: 25px; 
         border: 1px solid #ccc;
         outline: none;
         font-size: 16px;
+        padding: 10px 20px;
+        box-sizing: border-box;
     }
     #send-button { 
-        background-color: #128c7e; 
+        background-color: #007BFF; 
         color: white; 
-        padding: 10px; 
+        padding: 10px 20px; 
         border: none; 
         border-radius: 50%; 
         cursor: pointer;
         margin-left: 10px;
-        width: 1%;
-        height: 1%;
+        width: 50px;
+        height: 50px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
         font-size: 20px;
     }
     #send-button:hover { 
-        background-color: #075e54; 
+        background-color: #0056b3; 
     }
     #clear-button { 
-        background-color: #25D366; 
+        background-color: #dc3545; 
         color: white; 
         padding: 10px 20px; 
         border: none; 
@@ -132,7 +139,7 @@ with gr.Blocks(css="""
         font-size: 14px;
     }
     #clear-button:hover { 
-        background-color: #128c7e; 
+        background-color: #c82333; 
     }
     .message { 
         margin-bottom: 10px; 
@@ -151,8 +158,19 @@ with gr.Blocks(css="""
     #chatbot::-webkit-scrollbar-thumb:hover {
         background: #555;
     }
+    /* Responsive Design */
+    @media (max-width: 600px) {
+        #send-button {
+            width: 40px;
+            height: 40px;
+            font-size: 18px;
+        }
+        #textbox {
+            padding: 8px 16px;
+        }
+    }
 """) as demo:
-    gr.Markdown("<h1 style='text-align: center; color: #075e54;'>🤖 Human-like Chatbot 🤖</h1>")
+    gr.Markdown("<h1 style='text-align: center; color: #007BFF;'>🤖 Human-like Chatbot 🤖</h1>")
     with gr.Row():
         with gr.Column(scale=1):
             chatbot = gr.Chatbot(label="Chatbot", elem_id="chatbot", type="messages")
@@ -167,7 +185,7 @@ with gr.Blocks(css="""
                 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