Update app.py

app.py

@@ -13,38 +13,7 @@ def respond(
     temperature,
     top_p,
 ):
-    messages = [{"role": "system", "content": system_message}]
-
-    for val in history:
-        if val[0]:
-            messages.append({"role": "user", "content": val[0]})
-        if val[1]:
-            messages.append({"role": "assistant", "content": val[1]})
-
-    messages.append({"role": "user", "content": message})
-
-    response = ""
-
-    for message in client.chat_completion(
-        messages,
-        max_tokens=max_tokens,
-        stream=True,
-        temperature=temperature,
-        top_p=top_p,
-    ):
-        token = message.choices[0].delta.content
-
-        response += token
-        yield response
-
-# Create a custom theme for the chat interface
-theme = gr.Theme(
-    primary_color="#3498db",
-    secondary_color="#f1c40f",
-    background_color="#f9f9f9",
-    text_color="#333",
-    font="Open Sans",
-)
+    #... (rest of the code remains the same)
 
 # Create the chat interface
 demo = gr.ChatInterface(
@@ -63,8 +32,44 @@ demo = gr.ChatInterface(
             label="Top-p (nucleus sampling)",
         ),
     ],
-    theme=theme,
 )
 
+# Add custom CSS to customize the theme
+css = """
+body {
+    background-color: #f9f9f9;
+}
+
+.gradio-container {
+    max-width: 800px;
+    margin: 40px auto;
+    padding: 20px;
+    border: 1px solid #ddd;
+    border-radius: 10px;
+    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+}
+
+.gradio-input {
+    background-color: #fff;
+    border: 1px solid #ccc;
+    padding: 10px;
+    border-radius: 10px;
+}
+
+.gradio-button {
+    background-color: #3498db;
+    color: #fff;
+    border: none;
+    padding: 10px 20px;
+    border-radius: 10px;
+    cursor: pointer;
+}
+
+.gradio-button:hover {
+    background-color: #2980b9;
+}
+"""
+demo.css(css)
+
 if __name__ == "__main__":
     demo.launch()