Textbox Adjustments

app.py

@@ -237,22 +237,30 @@ custom_css = """
     padding: 20px;
 }
 
-/* Clear button styling */
-.clear-button {
+/* Button styling */
+.clear-button, .send-button {
     background-color: rgb(28, 18, 5) !important;
     color: white !important;
     border: none !important;
     border-radius: 10px !important;
     padding: 8px 16px !important;
     cursor: pointer !important;
-    margin-bottom: 10px !important;
+    margin: 5px !important;
 }
 
-.clear-button:hover {
+.clear-button:hover, .send-button:hover {
     background-color: rgba(28, 18, 5, 0.8) !important;
 }
 
-/* Textbox styling */
+.send-button {
+    background-color: rgb(51, 102, 204) !important;
+}
+
+.send-button:hover {
+    background-color: rgba(51, 102, 204, 0.8) !important;
+}
+
+/* Textbox styling - keep it simple */
 .input-textbox {
     background-color: rgb(242, 238, 233) !important;
     border: 2px solid rgb(28, 18, 5) !important;
@@ -285,7 +293,9 @@ with gr.Blocks(css=custom_css, title="EduBot") as demo:
     
     # Input Section
     with gr.Column(elem_classes=["input-section"]):
-        clear = gr.Button("Clear", elem_classes=["clear-button"])
+        with gr.Row():
+            clear = gr.Button("Clear", elem_classes=["clear-button"])
+            send = gr.Button("Send", elem_classes=["send-button"])
         msg = gr.Textbox(
             placeholder="Ask me about math, research, study strategies, or any educational topic...",
             show_label=False,
@@ -319,8 +329,9 @@ with gr.Blocks(css=custom_css, title="EduBot") as demo:
         """Clear the chat history."""
         return [], ""
 
-    # Set up the "send on Enter" event
+    # Set up the "send on Enter" event and send button click
     msg.submit(respond_and_update, [msg, chatbot], [chatbot, msg])
+    send.click(respond_and_update, [msg, chatbot], [chatbot, msg])
     
     # Set up the clear button
     clear.click(clear_chat, outputs=[chatbot, msg])