Update app.py

app.py

@@ -11,19 +11,21 @@ st.set_page_config(
     initial_sidebar_state="collapsed"
 )
 
-# Custom CSS for light purple theme
+# Custom CSS for enhanced light purple theme
 st.markdown("""
 <style>
 :root {
     --primary: #b19cd9;
-    --background: #f5f0ff;
+    --primary-dark: #8a7faa;
+    --background: linear-gradient(135deg, #f5f0ff, #e6d7ff);
     --secondary-background: #e6e0fa;
     --text: #4a4a4a;
     --font: "Arial", sans-serif;
 }
 
 body {
-    background-color: var(--background);
+    background-image: var(--background);
+    background-attachment: fixed;
     color: var(--text);
     font-family: var(--font);
 }
@@ -31,14 +33,22 @@ body {
 .stTextInput>div>div>input {
     background-color: var(--secondary-background) !important;
     color: var(--text) !important;
+    border: 2px solid var(--primary) !important;
+    border-radius: 12px;
 }
 
 .stButton>button {
     background-color: var(--primary) !important;
     color: white !important;
     border: none;
-    border-radius: 8px;
+    border-radius: 12px;
     padding: 8px 16px;
+    transition: all 0.3s ease;
+}
+
+.stButton>button:hover {
+    background-color: var(--primary-dark) !important;
+    transform: scale(1.05);
 }
 
 .stMarkdown {
@@ -47,67 +57,105 @@ body {
 }
 
 .chat-message {
-    padding: 12px;
-    border-radius: 12px;
-    margin: 8px 0;
+    padding: 12px 16px;
+    border-radius: 16px;
+    margin: 10px 0;
     max-width: 80%;
+    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
 }
 
 .user-message {
     background-color: var(--secondary-background);
     margin-left: auto;
-    text-align: right;
+    text-align: left;
+    border-bottom-right-radius: 4px;
 }
 
 .bot-message {
     background-color: var(--primary);
     color: white;
     margin-right: auto;
+    border-bottom-left-radius: 4px;
 }
 
 .face-container {
     text-align: center;
     padding: 20px;
-    background: white;
-    border-radius: 16px;
-    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
-    margin: 20px 0;
+    background: rgba(255, 255, 255, 0.7);
+    backdrop-filter: blur(5px);
+    border-radius: 20px;
+    box-shadow: 0 8px 20px rgba(0,0,0,0.1);
+    margin: 20px auto;
+    max-width: 300px;
+    border: 2px solid var(--primary);
+}
+
+.header {
+    text-align: center;
+    margin-bottom: 20px;
+}
+
+.title {
+    color: var(--primary);
+    font-size: 2.5rem;
+    margin-bottom: 10px;
+    text-shadow: 1px 1px 3px rgba(0,0,0,0.1);
+}
+
+.subtitle {
+    color: var(--text);
+    font-size: 1.1rem;
+    margin-bottom: 30px;
+}
+
+.footer {
+    text-align: center;
+    margin-top: 30px;
+    color: var(--primary);
+    font-size: 0.9rem;
 }
 </style>
 """, unsafe_allow_html=True)
 
 # Emotion databases
-POSITIVE_WORDS = {"happy", "awesome", "great", "joy", "excited", "good", "wonderful", "fantastic", "amazing"}
-NEGATIVE_WORDS = {"sad", "depressed", "angry", "cry", "lonely", "bad", "terrible", "awful", "miserable"}
+POSITIVE_WORDS = {"happy", "awesome", "great", "joy", "excited", "good", "wonderful", "fantastic", "amazing", "yay", "ecstatic"}
+NEGATIVE_WORDS = {"sad", "depressed", "angry", "cry", "lonely", "bad", "terrible", "awful", "miserable", "upset", "grief"}
+LOVE_WORDS = {"love", "heart", "adore", "crush", "romance", "affection", "passion"}
 HELP_RESPONSES = [
     "Would you like to talk about it? 💬",
-    "I'm here to listen 💙",
+    "I'm here to listen whenever you need 💙",
     "Want some uplifting quotes? 📜",
     "Would a virtual hug help? 🤗",
-    "Let's focus on something positive 🌈"
+    "Let's focus on something positive 🌈",
+    "Remember: this too shall pass 🌤️"
 ]
 
 # ASCII Art Library
 FACES = {
     "happy": r"""
-  ╔════════╗
-  😄 AWESOME!  
-  ╚════════╝
+  ╔════════════╗
+  😄 AWESOME DAY!  
+  ╚════════════╝
     """,
     "sad": r"""
-  ╔════════╗
-  😢 SAD DAY?  
-  ╚════════╝
+  ╔════════════╗
+  😢 TOUGH TIMES?  
+  ╚════════════╝
     """,
     "neutral": r"""
-  ╔════════╗
-  😐 HELLO   
-  ╚════════╝
+  ╔════════════╗
+  😐 HELLO THERE   
+  ╚════════════╝
     """,
     "love": r"""
-  ╔════════╗
-  😍 LOVELY!  
-  ╚════════╝
+  ╔════════════╗
+  😍 LOVELY FEELING!  
+  ╚════════════╝
+    """,
+    "angry": r"""
+  ╔════════════╗
+  😠 TAKE A DEEP BREATH  
+  ╚════════════╝
     """
 }
 
@@ -123,7 +171,8 @@ def confetti_effect():
 
     function fire(particleRatio, opts) {
         confetti(Object.assign({}, defaults, opts, {
-            particleCount: Math.floor(count * particleRatio)
+            particleCount: Math.floor(count * particleRatio),
+            colors: ['#b19cd9', '#e6d7ff', '#8a7faa', '#ffffff']
         }));
     }
 
@@ -143,8 +192,10 @@ def detect_emotion(text):
         return "happy"
     elif any(word in text for word in NEGATIVE_WORDS):
         return "sad"
-    elif "love" in text or "heart" in text:
+    elif any(word in text for word in LOVE_WORDS):
         return "love"
+    elif "angry" in text or "mad" in text or "furious" in text:
+        return "angry"
     return "neutral"
 
 # Initialize chat history
@@ -152,9 +203,8 @@ if "messages" not in st.session_state:
     st.session_state.messages = []
     st.session_state.current_emotion = "neutral"
 
-# Title and description
-st.title("✨ Emotion Mirror Chatbot")
-st.markdown("I'm a reactive AI agent that mirrors your emotions! Try words like *happy*, *sad*, or *awesome*")
+# Header with title and description
+st.markdown('<div class="header"><div class="title">✨ Emotion Mirror Chatbot</div><div class="subtitle">I\'m a reactive AI agent that mirrors your emotions! Try words like <i>happy, sad, love,</i> or <i>awesome</i></div></div>', unsafe_allow_html=True)
 
 # Display current face
 with st.container():
@@ -178,12 +228,14 @@ if prompt := st.chat_input("How are you feeling today?"):
     
     # Generate bot response
     if emotion == "happy":
-        response = FACES["happy"] + "\n\n🌟 That's wonderful to hear!"
+        response = FACES["happy"] + "\n\n🌟 That's wonderful to hear! Keep spreading positivity!"
         confetti_effect()
     elif emotion == "sad":
         response = FACES["sad"] + "\n\n" + random.choice(HELP_RESPONSES)
     elif emotion == "love":
-        response = FACES["love"] + "\n\n💖 Love is in the air!"
+        response = FACES["love"] + "\n\n💖 Love is the most beautiful feeling! Treasure it."
+    elif emotion == "angry":
+        response = FACES["angry"] + "\n\n☁️ Take a deep breath. Count to ten. You've got this."
     else:
         response = FACES["neutral"] + "\n\nTell me more about your feelings..."
     
@@ -191,10 +243,13 @@ if prompt := st.chat_input("How are you feeling today?"):
     st.session_state.messages.append({"role": "bot", "content": response})
     
     # Rerun to update the display
-    st.experimental_rerun()
+    st.rerun()
 
 # Add reset button
 if st.button("Reset Conversation"):
     st.session_state.messages = []
     st.session_state.current_emotion = "neutral"
-    st.experimental_rerun()
+    st.rerun()
+
+# Footer
+st.markdown('<div class="footer">Made with ❤️ | Reactive AI Agent | Streamlit</div>', unsafe_allow_html=True)