Update app.py

app.py

@@ -36,33 +36,55 @@ st.set_page_config(
     page_icon="cspclogo.png"
 )
 
-with st.sidebar:
-    st.title('CSPCean Conversational Agent')
-    st.subheader('Ask anything CSPC Related here!')
-
-    st.markdown('''**About CSPC:**
-        History, Core Values, Mission and Vision''')
-
-    st.markdown('''**Admission & Graduation:**
-        Apply, Requirements, Process, Graduation''')
+# Custom CSS for styling
+st.markdown(
+    """
+    <style>
+    # .main {background-color: #f4f4f4;}
+    .title {text-align: center; font-size: 30px; font-weight: bold; color: #ffffff;}
+    .subtitle {text-align: center; font-size: 18px; font-weight: bold; color: #dddddd;}
+    .category {font-size: 16px; font-weight: bold; color: #222;}
+    .details {font-size: 14px; color: #bbbbbb; margin-left: 25px; margin-top: -10px; margin-bottom: 5px;}
+    .details1 {font-size: 14px; color: #bbbbbb; margin-left: 25px; margin-top: -10px; margin-bottom: 10px;}
+    .team {text-align: center; font-size: 14px; font-weight: bold; color: #777; margin-top: 20px;}
+    .resources a {color: #0066cc; text-decoration: none; font-weight: bold;}
+    .resources a:hover {color: #003366;}
+    </style>
+    """,
+    unsafe_allow_html=True
+)
 
-    st.markdown('''**Student Services:**
-         Scholarships, Orgs, Facilities''')
+with st.sidebar:
+    # App title
+    st.markdown('<p class="title">CSPC Conversational Agent</p>', unsafe_allow_html=True)
+    st.markdown('<p class="subtitle">Your go-to assistant for the Citizen’s Charter of CSPC!</p>', unsafe_allow_html=True)
+    
+    # Categories
+    st.markdown('''✔️**About CSPC:**''')
+    st.markdown('<p class="details">History, Core Values, Mission and Vision</p>', unsafe_allow_html=True)
+    
+    st.markdown('''✔️**Admission & Graduation:**''')
+    st.markdown('<p class="details">Apply, Requirements, Process, Graduation</p>', unsafe_allow_html=True)
 
-    st.markdown('''**Academics:**
-         Degrees, Courses, Faculty''')
+    st.markdown('''✔️**Student Services:**''')
+    st.markdown('<p class="details">Scholarships, Orgs, Facilities</p>', unsafe_allow_html=True)
 
-    st.markdown('''**Officials:**
-         President, VPs, Deans, Admin''')
+    st.markdown('''✔️**Academics:**''')
+    st.markdown('<p class="details">Degrees, Courses, Faculty</p>', unsafe_allow_html=True)
 
-    st.markdown('''
-        Access the resources here:
+    st.markdown('''✔️**Officials:**''')
+    st.markdown('<p class="details1">President, VPs, Deans, Admin</p>', unsafe_allow_html=True)
 
-        - [CSPC Citizen’s Charter](https://cspc.edu.ph/governance/citizens-charter/)
-        - [About CSPC](https://cspc.edu.ph/about/)
-        - [College Officials](https://cspc.edu.ph/college-officials/)
-    ''')
-    st.markdown('Team XceptionNet')
+    # Links to resources
+    st.markdown("### 🔗 Quick Access to Resources")
+    st.markdown(
+        """
+        📄 [CSPC Citizen’s Charter](https://cspc.edu.ph/governance/citizens-charter/)  
+        🏛️ [About CSPC](https://cspc.edu.ph/about/)  
+        📋 [College Officials](https://cspc.edu.ph/college-officials/)  
+        """,
+        unsafe_allow_html=True
+    )
 
 # Store LLM generated responses
 if "messages" not in st.session_state:
@@ -168,7 +190,7 @@ if prompt := st.chat_input(placeholder="Ask a question..."):
 # Clear chat history function
 def clear_chat_history():
     # Clear chat messages (reset the assistant greeting)
-    st.session_state.messages = [{"role": "assistant", "content": "How may I help you today?"}]
+    st.session_state.messages = [{"role": "assistant", "content": "Hello! I am your Conversational Agent for the Citizens Charter of Camarines Sur Polytechnic Colleges (CSPC). How may I assist you today?"}]
     
     # Reinitialize the chain to clear any stored history (ensures it forgets previous user inputs)
     st.session_state.chain = init_chain()
@@ -177,4 +199,7 @@ def clear_chat_history():
     st.session_state.query_counter = 0
     st.session_state.conversation_history = ""
 
-st.sidebar.button('Clear Chat History', on_click=clear_chat_history)
+st.sidebar.button('Clear Chat History', on_click=clear_chat_history
+
+# Footer
+st.sidebar.markdown('<p class="team">Developed by Team XceptionNet</p>', unsafe_allow_html=True)