Update app.py

app.py

@@ -184,7 +184,6 @@ with gr.Blocks(theme=theme, css="""
        min-height: 400px;
        max-height: calc(100vh - 200px);
    }
-   
    .chat-bot .message-wrap .avatar-container {
        display: none !important;
    }
@@ -195,7 +194,6 @@ with gr.Blocks(theme=theme, css="""
    .gradio-chatbot .message.user .avatar-container {
        display: none !important;
    }
-   
    .input-row {
        flex-shrink: 0;
        margin-top: 0.5rem;
@@ -207,42 +205,33 @@ with gr.Blocks(theme=theme, css="""
        margin-left: auto;
        margin-right: auto;
    }
-   
    .custom-textbox {
        flex: 1;
        min-width: 400px;
    }
-   
    .custom-textbox > div {
        width: 100% !important;
    }
-   
-   .custom-textbox input,
    .custom-textbox textarea {
-       border-radius: 25px !important;
-       border: 2px solid #64748b !important;
+       border-radius: 12px !important;
+       border: 1pt solid #64748b !important;
        padding: 15px 20px !important;
        font-size: 16px !important;
        background: white !important;
        outline: none !important;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
        transition: all 0.3s ease !important;
-       min-height: 50px !important;
-       height: 50px !important;
+       min-height: 100px !important;
+       resize: vertical !important;
        width: 100% !important;
-       resize: none !important;
    }
-   
-   .custom-textbox input:focus,
    .custom-textbox textarea:focus {
        border-color: #475569 !important;
        box-shadow: 0 0 0 3px rgba(100, 116, 139, 0.1) !important;
    }
-   
    .custom-textbox label {
        display: none !important;
    }
-   
    .send-button {
        border-radius: 50% !important;
        width: 50px !important;
@@ -252,7 +241,6 @@ with gr.Blocks(theme=theme, css="""
        justify-content: center !important;
        flex-shrink: 0 !important;
    }
-   
    @media (max-width: 768px) {
        .main-container {
            padding: 0.5rem;
@@ -273,34 +261,23 @@ with gr.Blocks(theme=theme, css="""
        .custom-textbox {
            min-width: 250px;
        }
-        .custom-textbox textarea {
-            border-radius: 12px !important;
-            border: 1pt solid #64748b !important;  /* 1pt slate border */
-            padding: 15px 20px !important;
-            font-size: 16px !important;
-            background: white !important;
-            outline: none !important;
-            box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
-            transition: all 0.3s ease !important;
-            min-height: 100px !important; 
-            resize: vertical !important; 
-}
+       .custom-textbox textarea {
+           min-height: 80px !important;
+           font-size: 14px !important;
+       }
    }
-   
    @media (min-width: 769px) and (max-width: 1024px) {
        .gradio-chatbot {
            min-height: 450px;
            max-height: calc(100vh - 180px);
        }
    }
-   
    @media (min-width: 1025px) {
        .gradio-chatbot {
            min-height: 500px;
            max-height: calc(100vh - 200px);
        }
    }
-   
    @media (max-height: 500px) and (orientation: landscape) {
        .title {
            font-size: 1.2rem;
@@ -312,12 +289,10 @@ with gr.Blocks(theme=theme, css="""
        }
    }
 """) as demo:
-   
    with gr.Column(elem_classes=["main-container"]):
        gr.HTML("""
        <div class='title'>🎓 EduBot</div>
        """)
-       
        with gr.Column(elem_classes=["chat-container"]):
            chatbot = gr.Chatbot(
                show_copy_button=True,
@@ -326,29 +301,25 @@ with gr.Blocks(theme=theme, css="""
                container=True,
                elem_classes=["gradio-chatbot"]
            )
-       
        with gr.Row(elem_classes=["input-row"]):
            msg = gr.Textbox(
-            placeholder="Ask me about math, research, study strategies, or any educational topic...",
-            container=False,
-            show_label=False,
-            elem_classes=["custom-textbox"],
-            lines=4,       
-            max_lines=8     
-            )
+               placeholder="Ask me about math, research, study strategies, or any educational topic...",
+               container=False,
+               show_label=False,
+               elem_classes=["custom-textbox"],
+               lines=4,
+               max_lines=8
+           )
            send_btn = gr.Button("📤", variant="primary", elem_classes=["send-button"])
-   
    def respond_and_update(message, history):
        for response in respond_with_enhanced_streaming(message, history):
            history.append([message, response])
            yield history, ""
-       
    msg.submit(
        respond_and_update,
        [msg, chatbot],
        [chatbot, msg]
    )
-   
    send_btn.click(
        respond_and_update,
        [msg, chatbot],
@@ -357,4 +328,4 @@ with gr.Blocks(theme=theme, css="""
 
 if __name__ == "__main__":
    logger.info("Starting EduBot with custom styling...")
-   demo.launch()
+   demo.launch()