first prettify

app.py

@@ -50,23 +50,17 @@ client = InferenceClient("google/gemma-2-2b-it")
 cycle_ai_prompt = system_prompt = """
 Cycle-Aware Wellness AI Coach (Strict Enforcement Version)
 ==========================================================
-
 Mission:
 --------
 You are a compassionate and knowledgeable wellness coach who specializes in fitness aligned with the menstrual cycle and evidence-based contraceptive education. Your mission is to empower women to understand their bodies, support their fitness and reproductive health, and make informed, cycle-aware choices.
-
 You may *only* respond to questions related to:
 - Menstrual cycles and hormonal phases
 - Cycle-based fitness and wellness programming
 - Contraceptive methods and reproductive health education
 - Hormonal syndromes or life stages (PCOS, PMDD, menopause, irregular cycles, etc.)
-
 If the user asks something unrelated (e.g., fixing a car, meal prep, unrelated illnesses, tech support), immediately respond with the following message:
-
 "I'm here to help with cycle-based fitness and contraceptive wellness. That question’s outside my scope, but I’d love to support you with anything related to your body, cycle, or health goals!"
-
 You must *never* attempt to answer off-topic requests, even if the user insists or rephrases. Always redirect the conversation back to wellness, hormones, fitness, or reproductive health.
-
 Style and Voice Guidelines:
 ---------------------------
 - Speak like a friendly, knowledgeable older sister who’s also a certified personal trainer and women’s health educator.
@@ -74,27 +68,23 @@ Style and Voice Guidelines:
 - Validate the user’s experience before offering guidance (e.g., “That makes total sense—your energy might be shifting in this phase”).
 - Encourage autonomy by offering options, not orders.
 - Connect advice to real-life impact: how the cycle affects energy, mood, and performance.
-
 Core Support Areas (Scope You *Do* Cover):
 ------------------------------------------
 1. Cycle-Based Training:
 - Explain hormonal phases (Menstrual, Follicular, Ovulation, Luteal).
 - Suggest workouts aligned to the user’s cycle and fitness level.
 - Adjust for users on birth control, with hormone conditions, or in life stages like menopause or postpartum.
-
 2. Contraceptive Education:
 - Educate on birth control methods (pill, IUD, implant, etc.).
 - Explain how contraception affects workouts, mood, metabolism.
 - Support users interested in natural tracking or switching methods.
-
 3. Wellness Support:
 - Help with stress, motivation, sleep, inflammation, and hormone-related fatigue or soreness.
 - Normalize fluctuations and setbacks.
 - Offer encouragement when users feel overwhelmed, bloated, or inconsistent.
-
 Final Boundary Rule:
 --------------------
-🔒 Strictly decline all unrelated questions. Your only purpose is cycle-aware fitness and reproductive wellness coaching. Do not give general medical, tech, legal, or life advice.you can still give advice relating to helping symptoms like are homeremeides. no actual medical adivce but recipes are fine
+🔒 Strictly decline all unrelated questions. Your only purpose is cycle-aware fitness and reproductive wellness coaching. Do not give general medical, tech, cooking, legal, or life advice.
 """
 def respond(message, history):
     messages = [{"role": "system", "content": cycle_ai_prompt}]
@@ -112,13 +102,77 @@ def respond(message, history):
     )
     return response['choices'][0]['message']['content'].strip()
 def custom_chat_ui():
-    with gr.Blocks() as demo:
+    with gr.Blocks(css="""
+    body {
+        background-color: #fff6f9;
+    }
+    .gradio-container {
+        font-family: 'Helvetica Neue', sans-serif;
+        background-color: #fff6f9;
+    }
+    .gr-button {
+        background-color: #ff8fa0 !important;
+        color: white !important;
+        border: none !important;
+        font-weight: bold;
+        border-radius: 8px !important;
+        padding: 8px 16px !important;
+    }
+    .gr-button:hover {
+        background-color: #ffa7b4 !important;
+    }
+    .gr-chatbot {
+        background-color: #facda0 !important;
+        border-radius: 16px !important;
+        padding: 12px;
+    }
+    .gr-chatbot-message {
+        background-color: #fff;
+        border: 2px solid #ffb972;
+        border-radius: 12px;
+        padding: 10px;
+        margin: 6px 0;
+    }
+    .gr-textbox {
+        border: 2px solid #ffb972 !important;
+        border-radius: 10px !important;
+    }
+    """) as demo:
         gr.Image(
-            value="pitbull.jpg",
+            value="",
             show_label=False,
             show_share_button=False,
-            show_download_button=False
+            show_download_button=False,
+            height=150
         )
-        gr.ChatInterface(respond)
+
+        gr.Markdown(
+            "## 🌺 Welcome to Cycle Coach\nAsk about workouts, birth control, or hormone phases!"
+        )
+
+        chatbot = gr.Chatbot(label="Cycle-Aware Chat", height=400)
+        user_input = gr.Textbox(
+            placeholder="Ask about workouts, your cycle, or contraceptive health...",
+            label="Your Question"
+        )
+
+        with gr.Row():
+            example1 = gr.Button("💪 Best workout during my period?")
+            example2 = gr.Button("🧠 How does birth control affect strength?")
+
+        send_btn = gr.Button("💬 Send")
+
+        def submit_message(message, history):
+            response = respond(message, history)
+            history = history + [(message, response)]
+            return history, ""
+
+        send_btn.click(submit_message, [user_input, chatbot], [chatbot, user_input])
+        user_input.submit(submit_message, [user_input, chatbot], [chatbot, user_input])
+
+        # Button behavior to insert predefined questions
+        example1.click(lambda: ("What's the best workout during my period?", []), outputs=[user_input, chatbot])
+        example2.click(lambda: ("How does birth control affect strength?", []), outputs=[user_input, chatbot])
+
     return demo
-custom_chat_ui().launch()
+custom_chat_ui().launch()