Update app.py

app.py

@@ -52,14 +52,15 @@ if "session_id" not in st.session_state:
 st.markdown("""
     <style>
         body {
-            background-color: #E3F2FD;
+            background-color: #F0F8FF;
         }
         .title-text {
             text-align: center;
-            font-size: 28px;
+            font-size: 32px;
             font-weight: bold;
-            color: #1976D2;
+            color: #1E88E5;
             padding: 15px;
+            text-shadow: 2px 2px 5px rgba(0,0,0,0.2);
         }
         .stTextInput {
             position: fixed;
@@ -67,21 +68,35 @@ st.markdown("""
             width: 80%;
             left: 10%;
             z-index: 999;
+            border-radius: 20px;
+            padding: 10px;
+            border: 2px solid #1E88E5;
         }
         .chat-container {
             background-color: white;
             padding: 20px;
-            border-radius: 10px;
-            box-shadow: 2px 2px 10px rgba(0,0,0,0.1);
+            border-radius: 15px;
+            box-shadow: 3px 3px 12px rgba(0,0,0,0.2);
+        }
+        .user-message {
+            color: #00897B;
+            font-weight: bold;
+        }
+        .assistant-message {
+            color: #D81B60;
+            font-weight: bold;
         }
     </style>
 """, unsafe_allow_html=True)
 
-# Display title
-st.markdown("""<h1 class='title-text'>💬 AI Data Science Tutor</h1>""", unsafe_allow_html=True)
+# Display title with animation
+st.markdown("""
+<h1 class='title-text'>✨💬 AI Data Science Tutor 🚀✨</h1>
+""", unsafe_allow_html=True)
 
-# New Chat Button
-if st.button("🆕 New Chat"):
+# New Chat Button with emoji
+theme_button = st.button("🔄 Start a New Chat")
+if theme_button:
     st.session_state.session_id = str(uuid.uuid4())  # Generate new session
     st.session_state.messages = []  # Clear chat history
     st.rerun()  # Refresh the app
@@ -117,7 +132,7 @@ chat = RunnableWithMessageHistory(
 )
 
 # Chat History Container
-st.markdown("### Chat History")
+st.markdown("### 📜 Chat History")
 chat_container = st.container()
 
 # Load chat history and display it
@@ -127,10 +142,13 @@ if "messages" not in st.session_state:
 with chat_container:
     for role, content in st.session_state.messages:
         with st.chat_message(role):
-            st.markdown(content)
+            if role == "user":
+                st.markdown(f"<p class='user-message'>👤 {content}</p>", unsafe_allow_html=True)
+            else:
+                st.markdown(f"<p class='assistant-message'>🤖 {content}</p>", unsafe_allow_html=True)
 
 # User input at the bottom
-user_input = st.text_input("Type your message here:", key="user_message")
+user_input = st.text_input("💡 Type your message here:", key="user_message")
 
 # If user submits a message
 if user_input:
@@ -144,10 +162,10 @@ if user_input:
     save_message(session_id, "assistant", response)
     st.session_state.messages.append(("assistant", response))
 
-    # Display AI response
+    # Display AI response with animation
     with chat_container:
         with st.chat_message("assistant"):
-            st.markdown(response)
+            st.markdown(f"<p class='assistant-message'>🤖 {response}</p>", unsafe_allow_html=True)
 
     # Clear the input field
     st.session_state.pop("user_message")