Update app.py

app.py

@@ -6,8 +6,66 @@ initialize_llm()
 index = initialize_pinecone()
 query_engine = create_query_engine(index)
 
+# Inject custom CSS for aesthetics
+st.markdown("""
+    <style>
+    /* General styling */
+    body {
+        background-color: white;
+        color: #0a3d62;  /* Dark greenish-blue */
+    }
+    
+    /* Chatbot title styling */
+    .title {
+        font-size: 48px;
+        color: #0a3d62; /* Dark greenish-blue */
+        text-align: center;
+        font-family: 'Arial', sans-serif;
+    }
+    
+    /* Response styling */
+    .response {
+        font-size: 20px;
+        color: #0a3d62; /* Dark greenish-blue */
+        background-color: #f5f5f5;
+        border-radius: 10px;
+        padding: 20px;
+        margin: 20px 0;
+        font-family: 'Arial', sans-serif;
+    }
+
+    /* Button styling */
+    button {
+        background-color: #16a085;  /* Green */
+        color: white;
+        font-size: 18px;
+        padding: 10px;
+        border-radius: 5px;
+        width: 100%;
+    }
+
+    /* Text area styling */
+    textarea {
+        border: 1px solid #16a085;
+        border-radius: 5px;
+        padding: 10px;
+        font-size: 16px;
+        color: #0a3d62;
+    }
+    
+    /* Footer styling */
+    footer {
+        text-align: center;
+        font-size: 14px;
+        color: #16a085;
+        margin-top: 50px;
+    }
+
+    </style>
+    """, unsafe_allow_html=True)
+
 # Create a Streamlit app
-st.title("KYC SUD CONSULTING Chatbot")
+st.markdown("<div class='title'>KYC SUD CONSULTING Chatbot</div>", unsafe_allow_html=True)
 st.markdown("### Ask me anything about our company!")
 
 # Create a text input field for the user to enter their query
@@ -18,13 +76,12 @@ if st.button("Get Answer"):
     # Get the response from the query engine
     response = get_response(query_engine, query)
     # Display the response
-    st.write("### Response:")
-    st.write(response)
+    st.markdown(f"<div class='response'>{response}</div>", unsafe_allow_html=True)
 
 # Add some whitespace to make the app look more spacious
 st.write("\n\n")
 
 # Add a footer with some text
-st.markdown("### Powered by KYC SUD CONSULTING")
+st.markdown("<footer>Powered by KYC SUD CONSULTING</footer>", unsafe_allow_html=True)