Update app.py

app.py

@@ -3,6 +3,7 @@ from groq import Groq
 from langchain_groq import ChatGroq
 from langchain import hub
 from langchain_chroma import Chroma
+from langchain_community.document_loaders import WebBaseLoader
 from langchain.document_loaders import WebBaseLoader
 from langchain_core.output_parsers import StrOutputParser
 from langchain_core.runnables import RunnablePassthrough
@@ -48,22 +49,42 @@ def extract_text_from_url(url):
 # Set the page layout to wide for better UI space
 st.set_page_config(page_title="IESCO Query Application", layout="wide")
 
-# Main UI layout
+
+# # Main UI layout
 st.title("IESCO Query Application")
+# st.markdown("""
+# <style>
+#     .main-content {background-color: #f0f2f6; padding: 20px; border-radius: 10px;}
+#     .stButton>button {background-color: #4CAF50; color: white; font-size: 16px; border-radius: 10px;}
+#     .stTextInput>div>div>input {background-color: #f0f2f6; color: black; border-radius: 5px;}
+# </style>
+# """, unsafe_allow_html=True)
+
+st.markdown("<div class='main-content'>", unsafe_allow_html=True)
 
 url = "https://iesco.com.pk/index.php/customer-services/tariff-guide#"
 document_text = extract_text_from_url(url)
+st.text_area("Extracted Text", document_text, height=200)
 
-st.write("Extracted Text:")
-st.text_area("", document_text, height=200, disabled=True)
-
-query = st.text_input("Enter your query")
+query = st.text_input("🔍 Enter your query")
 
 if st.button("Submit"):
     if query:
         with st.spinner("Generating response..."):
             response = generate_response_groq(document_text, query)
-            st.write("Response:")
+            st.write("**Response:**")
             st.write(response)
     else:
-        st.error("Please enter a query.")
+        st.error("Please enter a query.")
+
+st.markdown("</div>", unsafe_allow_html=True)
+
+# Customize the theme and color contrast
+st.markdown("""
+<style>
+    .css-1aumxhk {background-color: #E8EAF6;}
+    .stTextInput>div>div>input {border-color: #3f51b5;}
+    .stTextArea>div>div>textarea {border-color: #3f51b5;}
+    .stButton>button {background-color: #3f51b5; color: white; font-size: 16px;}
+</style>
+""", unsafe_allow_html=True)