Update src/streamlit_app.py

src/streamlit_app.py

@@ -10,168 +10,130 @@ st.set_page_config(
 )
 
 # --------------------------------------------------
-# Custom CSS (HF Compatible + Visible UI)
+# Custom CSS (Ensuring High Visibility)
 # --------------------------------------------------
 st.markdown("""
 <style>
-
-/* Page background */
-.stApp {
-    background-color: #f4f7fb;
-}
-
-/* Main container */
-.block-container {
-    background-color: #ffffff;
-    padding: 2.5rem;
-    border-radius: 18px;
-    max-width: 900px;
-}
-
-/* Headings */
-h1, h2, h3 {
-    color: #0f172a !important;
-}
-
-/* Labels */
-label {
-    color: #1e293b !important;
-    font-weight: 600;
-}
-
-/* Inputs */
-input, textarea {
-    background-color: #ffffff !important;
-    color: #0f172a !important;
-    border-radius: 10px !important;
-    border: 1px solid #cbd5e1 !important;
-}
-
-/* Selectbox & Multiselect */
-div[data-baseweb="select"] {
-    background-color: #ffffff !important;
-    border-radius: 10px;
-}
-
-/* Form card */
-div[data-testid="stForm"] {
-    background-color: #f8fafc;
-    padding: 2rem;
-    border-radius: 14px;
-    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
-}
-
-/* Main button */
-.stButton > button {
-    width: 100%;
-    height: 3.2em;
-    border-radius: 10px;
-    background: linear-gradient(90deg, #2563eb, #1d4ed8);
-    color: white !important;
-    font-size: 17px;
-    font-weight: 600;
-    border: none;
-}
-
+    /* Force a clean, light background for the whole app */
+    .stApp {
+        background-color: #F0F2F6;
+    }
+
+    /* Card-style container for the form */
+    div[data-testid="stForm"] {
+        background-color: #FFFFFF !important;
+        padding: 30px !important;
+        border-radius: 15px !important;
+        border: 1px solid #E0E0E0 !important;
+        box-shadow: 0 4px 12px rgba(0,0,0,0.05);
+    }
+
+    /* Force all text labels and headers to be Dark Blue/Black */
+    h1, h2, h3, p, label, .stMarkdown {
+        color: #1A1C25 !important;
+    }
+
+    /* Style the Input boxes for clarity */
+    input {
+        color: #1A1C25 !important;
+        background-color: #F8F9FA !important;
+    }
+
+    /* Button styling */
+    .stButton > button {
+        width: 100%;
+        background: linear-gradient(90deg, #2563eb, #1d4ed8);
+        color: white !important;
+        font-weight: bold;
+        border: none;
+        padding: 10px;
+        border-radius: 8px;
+    }
 </style>
 """, unsafe_allow_html=True)
 
 # --------------------------------------------------
-# Title Section
+# Header
 # --------------------------------------------------
 st.title("💪 FitPlan AI")
-st.subheader("Milestone 1: Fitness Profile & BMI Analysis")
-st.write("Enter your details to calculate BMI and generate your fitness profile.")
+st.markdown("### Milestone 1: Fitness Profile & BMI Analysis")
+st.write("Complete your profile below to calculate your health metrics.")
 
 # --------------------------------------------------
 # Fitness Profile Form
 # --------------------------------------------------
 with st.form("fitness_form"):
-
-    # -------- Section 1 --------
-    st.header("🧍‍♂️ 1. Personal Information")
-
-    name = st.text_input("Full Name *")
+    st.markdown("#### 🧍‍♂️ 1. Personal Information")
+    
+    name = st.text_input("Full Name *", placeholder="e.g. John Doe")
 
     col1, col2 = st.columns(2)
     with col1:
-        height = st.number_input("Height (cm) *", min_value=0.0, step=0.1)
+        # Added min_value logic to prevent negatives
+        height = st.number_input("Height (cm) *", min_value=0.0, step=1.0, format="%.1f")
     with col2:
-        weight = st.number_input("Weight (kg) *", min_value=0.0, step=0.1)
-
-    st.divider()
+        weight = st.number_input("Weight (kg) *", min_value=0.0, step=0.1, format="%.1f")
 
-    # -------- Section 2 --------
-    st.header("🏋️ 2. Fitness Details")
+    st.markdown("---")
 
+    st.markdown("#### 🏋️ 2. Fitness Details")
+    
     goal = st.selectbox(
         "Fitness Goal",
         ["Build Muscle", "Weight Loss", "Strength Gain", "Abs Building", "Flexible"]
     )
 
     equipment = st.multiselect(
-        "Available Equipment",
-        ["Dumbbells", "Resistance Band", "Yoga Mat",
-         "Kettlebell", "Pull-up Bar", "No Equipment"]
+        "Available Equipment (Select all that apply)",
+        ["Dumbbells", "Resistance Band", "Yoga Mat", "Kettlebell", "Pull-up Bar", "No Equipment"],
+        default=["No Equipment"]
     )
 
     level = st.radio(
         "Fitness Level",
-        ["Beginner", "Intermediate", "Advanced"]
+        ["Beginner", "Intermediate", "Advanced"],
+        horizontal=True
     )
 
     submit = st.form_submit_button("Generate Profile")
 
 # --------------------------------------------------
-# Processing & Output
+# Logic & Output
 # --------------------------------------------------
 if submit:
-
-    # -------- Validation --------
+    # Validation checks
     if not name.strip():
-        st.error("⚠ Please enter your name.")
-    elif height <= 0 or weight <= 0:
-        st.error("⚠ Height and weight must be greater than zero.")
+        st.error("🚨 Name is required.")
+    elif height <= 50 or weight <= 10: # Realistic safety checks
+        st.error("🚨 Please enter valid height and weight values.")
     else:
-        # -------- BMI Calculation --------
+        # BMI Calculation
         height_m = height / 100
-        bmi = round(weight / (height_m ** 2), 2)
+        bmi = weight / (height_m ** 2)
+        bmi_display = round(bmi, 2)
 
-        # -------- BMI Classification --------
+        # Precise BMI Classification
         if bmi < 18.5:
-            category = "Underweight"
-            color = "blue"
-            progress = bmi / 18.5
-        elif 18.5 <= bmi < 24.9:
-            category = "Normal"
-            color = "green"
-            progress = bmi / 24.9
-        elif 25 <= bmi < 29.9:
-            category = "Overweight"
-            color = "orange"
-            progress = bmi / 29.9
-        else:
-            category = "Obese"
-            color = "red"
-            progress = 1.0
-
-        # -------- Results Section --------
-        st.success(f"✅ Profile created successfully for **{name}**")
-
-        colA, colB = st.columns(2)
-        with colA:
-            st.metric("Your BMI", bmi)
-        with colB:
-            st.markdown(f"**BMI Category:** :{color}[{category}]")
-
-        # -------- BMI Progress Bar --------
-        st.markdown("### 📊 BMI Progress Indicator")
-        st.progress(min(progress, 1.0))
-
-        # -------- Summary --------
-        st.info(f"🎯 Goal: {goal} | 📈 Level: {level}")
-
-        if equipment:
-            st.write("🧰 Equipment:", ", ".join(equipment))
+            category, color, progress = "Underweight", "blue", 0.25
+        elif 18.5 <= bmi < 25.0:
+            category, color, progress = "Normal", "green", 0.50
+        elif 25.0 <= bmi < 30.0:
+            category, color, progress = "Overweight", "orange", 0.75
         else:
-            st.write("🧰 Equipment: No equipment selected")
+            category, color, progress = "Obese", "red", 1.0
+
+        # Results Display
+        st.success(f"✅ Profile generated for {name}")
+        
+        m_col1, m_col2 = st.columns(2)
+        with m_col1:
+            st.metric("Your BMI", f"{bmi_display}")
+        with m_col2:
+            # Using bold colored markdown for high visibility
+            st.markdown(f"**Status:** :{color}[{category}]")
+
+        st.markdown("### 📊 BMI Visual Indicator")
+        st.progress(progress)
+        
+        # Summary Box
+        st.info(f"**Profile Summary:**\n\n* **Goal:** {goal}\n* **Experience:** {level}\n* **Equipment:** {', '.join(equipment) if equipment else 'None'}")