Update app.py

app.py

@@ -35,34 +35,42 @@ DESCRIPTION = """\
 #Löwolf GPT1 Chat
 """
 css = """
-h1 {
-  text-align: center;
-}
-
-#duplicate-button {
-  margin: auto;
-  color: white;
-  background: #1565c0;
-  border-radius: 100vh;
-}
-
-.contain {
-  max-width: 900px;
-  margin: auto;
-  padding-top: 1.5rem;
-}
-
+    body { font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; }
+    .gradio_app { display: flex; flex-direction: column-reverse; max-width: 800px; margin: auto; }
+    .gradio_interface { box-shadow: 0 0 20px rgba(0,0,0,0.1); }
+    .gradio_text_input { border-radius: 20px; }
+    .gradio_text_output { height: calc(100vh - 150px); border-radius: 20px; overflow-y: auto; }
+    button { border-radius: 20px; }
+    #input-box { order: 2; }
+    #output-box { order: 1; }
+    #input { height: 50px; }
+    #output { height: calc(100vh - 150px); }
 """
 
-iface = gr.Interface(
-    fn=generate_text,
-    
-    outputs=gr.Textbox(label="Löwolf Chat Responses", placeholder="Responses will appear here...", interactive=False, lines=10),
-    inputs=gr.Textbox(lines=2, placeholder="Type a message...", label="Your Message"),
-    css=css
-)
+# Update the Blocks structure to reflect the desired layout
+with gr.Blocks(css=css) as demo:
+    gr.Markdown(DESCRIPTION)
+    gr.Markdown(LICENSE)
+    gr.DuplicateButton(value="Duplicate Space for private use", elem_id="duplicate-button")
+    with gr.Row().style(equal_height=False):
+        output_box = gr.Textbox(interactive=False, lines=25, placeholder="Responses will appear here...", elem_id="output-box")
+        input_box = gr.Textbox(lines=1, placeholder="Type a message...", elem_id="input-box")
+    generate_button = gr.Button("Submit")
+    generate_button.click(
+        fn=generate,
+        inputs=[input_box],
+        outputs=output_box
+    )
+
+if __name__ == "__main__":
+    demo.queue(max_size=20).launch()
+
+
+
+
+
+
 
-iface.launch()