Update src/streamlit_app.py

src/streamlit_app.py

@@ -4,48 +4,47 @@ import numpy as np
 import plotly.graph_objects as go
 import os
 
-# Configuration de la page
-st.set_page_config(page_title="Brake Performance Lab", layout="wide", page_icon="🚲")
+# Configuration
+st.set_page_config(page_title="Brake Performance Lab", layout="wide")
 
-# --- CSS RADICAL : COMPACTAGE SIDEBAR + CONTRASTE ---
+# --- CSS DE LA DERNIÈRE CHANCE (FORÇAGE NOIR SUR BLANC) ---
 st.markdown("""
     <style>
-    .stApp { background-color: #FFFFFF !important; }
-
-    /* --- COMPACTAGE SIDEBAR --- */
-    /* On réduit l'espace entre tous les blocs de la sidebar */
-    [data-testid="stSidebar"] [data-testid="stVerticalBlock"] {
-        gap: 0.5rem !important;
-        padding-top: 0rem !important;
-    }
+    /* 1. Fond blanc pur partout */
+    .stApp, [data-testid="stSidebar"] { background-color: #FFFFFF !important; }
     
-    /* On réduit la marge au dessus des titres et sous les lignes --- */
-    hr { margin: 0.5rem 0 !important; }
-    .stSlider { margin-bottom: -15px !important; }
-    .stMultiSelect { margin-bottom: -10px !important; }
-    .stSelectbox { margin-bottom: -10px !important; }
+    /* 2. Compactage Sidebar */
+    [data-testid="stSidebar"] [data-testid="stVerticalBlock"] { gap: 0.1rem !important; padding-top: 0rem !important; }
 
-    [data-testid="stSidebar"] { background-color: #F8F9FB !important; border-right: 1px solid #000000; }
-    [data-testid="stSidebar"] label, [data-testid="stSidebar"] p, [data-testid="stSidebar"] span {
-        color: #000000 !important; font-weight: bold !important;
+    /* 3. Force le NOIR sur TOUS les textes (Labels, Titres, Menus) */
+    * { color: #000000 !important; font-family: sans-serif; }
+    
+    /* 4. Fix spécifique pour les LISTES DÉROULANTES (Selectbox / Multiselect) */
+    /* On force le fond en blanc et la bordure en noir */
+    div[data-baseweb="select"] {
+        border: 2px solid #000000 !important;
+        background-color: #FFFFFF !important;
+    }
+    /* On force le texte des options dans la liste qui s'ouvre */
+    ul[role="listbox"] { background-color: #FFFFFF !important; border: 2px solid #000000 !important; }
+    li[role="option"] { background-color: #FFFFFF !important; color: #000000 !important; }
+    li[role="option"]:hover { background-color: #0082C3 !important; color: #FFFFFF !important; }
+
+    /* Fix pour les tags (modèles sélectionnés) : Fond bleu, texte blanc pour qu'ils ressortent */
+    [data-testid="stMultiSelect"] span {
+        background-color: #0082C3 !important;
+        color: #FFFFFF !important;
     }
 
-    /* --- GESTION DES LISTES DÉROULANTES (NOIR SUR BLANC) --- */
-    div[data-baseweb="select"] > div { background-color: #000000 !important; color: #FFFFFF !important; }
-    div[data-baseweb="select"] span { color: #FFFFFF !important; }
-    ul[role="listbox"] { background-color: #000000 !important; }
-    ul[role="listbox"] li { color: #FFFFFF !important; background-color: #000000 !important; }
-    ul[role="listbox"] li:hover { background-color: #333333 !important; }
-
-    /* --- MAIN AREA --- */
-    * { color: #000000; }
-    [data-testid="stMetricValue"] { color: #000000 !important; font-weight: 800 !important; }
+    /* 5. Metrics et boîtes d'analyse en bas */
     [data-testid="column"] { 
-        padding: 10px !important; border: 2px solid #000000 !important; 
+        padding: 8px !important; border: 2px solid #000000 !important; 
         border-radius: 8px !important; background-color: #FFFFFF !important; 
     }
-    .alert-red { color: #B71C1C !important; font-weight: 900; }
-    .check-green { color: #1B5E20 !important; font-weight: 900; }
+    [data-testid="stMetricValue"] { font-weight: 800 !important; font-size: 20px !important; }
+    
+    /* On cache les indicateurs de flèches qui peuvent être gris */
+    [data-testid="stMetricDelta"] svg { display: none; }
     </style>
     """, unsafe_allow_html=True)
 
@@ -62,103 +61,72 @@ try:
     all_models = df['model name'].unique().tolist()
 
     with st.sidebar:
-        st.image("https://upload.wikimedia.org/wikipedia/commons/thumb/0/08/Decathlon_Logo.svg/1280px-Decathlon_Logo.svg.png", width=180)
-        st.title("⚙️ SETTINGS")
-        
-        # Les blocs sont maintenant rapprochés par le CSS "gap" et "margin"
-        x_input = st.slider("🫱 Lever Effort [N]", 40, 200, 100)
-        
-        selected_models = st.multiselect("Select Models to Display", options=all_models, default=all_models[:2])
-        
-        st.subheader("📋 Standard Compliance")
-        norm_type = st.selectbox("Category", ["None", "City/Trekking", "Kids", "MTB", "Racing"])
+        st.image("https://upload.wikimedia.org/wikipedia/commons/thumb/0/08/Decathlon_Logo.svg/1280px-Decathlon_Logo.svg.png", width=150)
+        st.markdown("**SETTINGS**")
+        x_input = st.slider("Lever Effort [N]", 40, 200, 100)
+        selected_models = st.multiselect("Models", options=all_models, default=all_models[:2])
+        norm_type = st.selectbox("Norm Category", ["None", "City/Trekking", "Kids", "MTB", "Racing"])
         
-        # Valeurs de normes officielles
         n_dry, n_wet = 0, 0
         if norm_type == "City/Trekking": n_dry, n_wet = 340, 220
         elif norm_type == "Kids": n_dry, n_wet = 204, 132
         elif norm_type == "MTB": n_dry, n_wet = 425, 280
         elif norm_type == "Racing": n_dry, n_wet = 425, 260
 
-        st.markdown("---")
-        with st.expander("🔍 Display Options"):
-            show_loss = st.checkbox("Show Wet Loss Analysis", value=True)
-            enable_comparison = st.checkbox("Enable Reference Comparison", value=True)
-            ref_model = st.selectbox("Reference Model", options=all_models)
-            condition_view = st.radio("Conditions", ["Both", "Dry only", "Wet only"], index=0)
+        with st.expander("Options"):
+            show_loss = st.checkbox("Show Loss", value=True)
+            enable_comparison = st.checkbox("Enable Ref", value=True)
+            ref_model = st.selectbox("Ref Model", options=all_models)
+            condition_view = st.radio("View", ["Both", "Dry only", "Wet only"])
 
-    # --- HEADER ---
-    if x_input < 70: label, color_alert = "❄️ LIGHT BRAKING", "#a1c4fd"
-    elif 70 <= x_input <= 110: label, color_alert = "⚖️ MODERATE BRAKING", "#ffdb58"
-    else: label, color_alert = "🔥 POWERFUL BRAKING", "#ff4b4b"
+    # --- DIAGNOSTIC ---
+    label, color = ("LIGHT", "#a1c4fd") if x_input < 70 else (("MODERATE", "#ffdb58") if x_input <= 110 else ("POWERFUL", "#ff4b4b"))
+    st.markdown(f"<div style='background-color:{color}; padding:5px; border:2px solid #000; text-align:center; font-weight:bold;'>{label} BRAKING | {x_input} N</div>", unsafe_allow_html=True)
 
-    st.markdown(f"""
-        <div style="background-color:{color_alert}; padding:8px; border-radius:8px; text-align:center; border: 3px solid #000000; margin-bottom: 10px;">
-            <span style="color:#000000; font-weight:900; font-size:16px;">{label} | Effort: {round(float(x_input), 1)} N</span>
-        </div>
-    """, unsafe_allow_html=True)
-
-    # --- GRAPHIC AREA ---
+    # --- GRAPHIC (FIX NOIR TOTAL) ---
     filtered_df = df[df['model name'].isin(selected_models)]
     fig = go.Figure()
-    x_range = np.linspace(40, 200, 150)
-    colors = ['#0082C3', '#E63312', '#000000', '#00A14B', '#FFD200']
+    x_range = np.linspace(40, 200, 100)
+    colors = ['#0082C3', '#E63312', '#333333', '#00A14B', '#FFD200']
 
     row_ref = df[df['model name'] == ref_model].iloc[0]
-    ref_dry_val = row_ref['dry a'] * x_input + row_ref['dry b']
-    ref_wet_val = row_ref['wet a'] * x_input + row_ref['wet b']
+    ref_d, ref_w = row_ref['dry a']*x_input+row_ref['dry b'], row_ref['wet a']*x_input+row_ref['wet b']
 
-    comparison_results = []
-    for i, (index, row) in enumerate(filtered_df.iterrows()):
-        color = colors[i % len(colors)]
-        y_d = row['dry a'] * x_input + row['dry b']
-        y_w = row['wet a'] * x_input + row['wet b']
-        comparison_results.append({"name": row['model name'], "dry": y_d, "wet": y_w, "row": row})
-        
+    for i, (idx, row) in enumerate(filtered_df.iterrows()):
+        c = colors[i % len(colors)]
         if condition_view in ["Both", "Dry only"]:
-            fig.add_trace(go.Scatter(x=x_range, y=row['dry a']*x_range+row['dry b'], mode='lines', name=f"{row['model name']} (Dry)", line=dict(color=color, width=4)))
-            if n_dry > 0:
-                xt = (n_dry - row['dry b']) / row['dry a']
-                if xt <= 200: fig.add_trace(go.Scatter(x=[xt], y=[n_dry], mode='markers+text', text=[f"{round(xt,1)}N"], textfont=dict(color="black", size=11, weight=700), textposition="top center", marker=dict(color=color, size=10, symbol='x'), showlegend=False))
-
+            fig.add_trace(go.Scatter(x=x_range, y=row['dry a']*x_range+row['dry b'], name=f"{row['model name']} (D)", line=dict(color=c, width=4)))
         if condition_view in ["Both", "Wet only"]:
-            fig.add_trace(go.Scatter(x=x_range, y=row['wet a']*x_range+row['wet b'], mode='lines', name=f"{row['model name']} (Wet)", line=dict(color=color, width=3, dash='dot')))
-            if n_wet > 0:
-                xtw = (n_wet - row['wet b']) / row['wet a']
-                if xtw <= 200: fig.add_trace(go.Scatter(x=[xtw], y=[n_wet], mode='markers+text', text=[f"{round(xtw,1)}N"], textfont=dict(color="black", size=11, weight=700), textposition="bottom center", marker=dict(color=color, size=10, symbol='circle-open'), showlegend=False))
-
-    fig.add_vline(x=x_input, line_width=2, line_dash="dash", line_color="#000000")
-    
-    if n_dry > 0 and (condition_view in ["Both", "Dry only"]):
-        fig.add_hline(y=n_dry, line_width=3, line_color="#000000", annotation_text=f"Norm Dry: {n_dry}N", annotation_font=dict(color="black", size=12, weight=700))
-    if n_wet > 0 and (condition_view in ["Both", "Wet only"]):
-        fig.add_hline(y=n_wet, line_width=3, line_dash="dot", line_color="#000000", annotation_text=f"Norm Wet: {n_wet}N", annotation_font=dict(color="black", size=12, weight=700))
+            fig.add_trace(go.Scatter(x=x_range, y=row['wet a']*x_range+row['wet b'], name=f"{row['model name']} (W)", line=dict(color=c, width=2, dash='dot')))
 
+    # Fix pour les noms des AXES (on force le NOIR pur ici)
     fig.update_layout(
-        height=450, xaxis=dict(title="Lever Effort [N]", color="#000000", linecolor="#000000", linewidth=3, tickfont=dict(color="#000000", weight=700), gridcolor="#E0E0E0"),
-        yaxis=dict(title="Performance [N]", color="#000000", linecolor="#000000", linewidth=3, tickfont=dict(color="#000000", weight=700), gridcolor="#E0E0E0"),
-        font=dict(color="#000000"), plot_bgcolor='#FFFFFF', paper_bgcolor='#FFFFFF', hovermode="x unified",
-        legend=dict(font=dict(color="#000000", size=11, weight=700), bordercolor="#000000", borderwidth=1, bgcolor="#FFFFFF")
+        height=450, plot_bgcolor='white', paper_bgcolor='white',
+        xaxis=dict(title=dict(text="Lever Effort [N]", font=dict(color="black", size=14, family="Arial Black")), 
+                   tickfont=dict(color="black", size=12, weight=700), linecolor="black", linewidth=2, gridcolor="#EEE"),
+        yaxis=dict(title=dict(text="Performance [N]", font=dict(color="black", size=14, family="Arial Black")), 
+                   tickfont=dict(color="black", size=12, weight=700), linecolor="black", linewidth=2, gridcolor="#EEE"),
+        legend=dict(font=dict(color="black", weight=700), bordercolor="black", borderwidth=1),
+        hovermode="x unified"
     )
     st.plotly_chart(fig, use_container_width=True)
 
     # --- ANALYSIS ---
-    st.markdown(f"<p style='color:#000000; font-weight:900; font-size:16px; margin-top:-10px;'>📊 Analysis | Ref: {ref_model}</p>", unsafe_allow_html=True)
-    
+    st.markdown("**ANALYSIS**")
     if not filtered_df.empty:
-        cols = st.columns(len(comparison_results))
-        for i, res in enumerate(comparison_results):
+        cols = st.columns(len(filtered_df))
+        for i, (idx, row) in enumerate(filtered_df.iterrows()):
             with cols[i]:
-                st.markdown(f"<p style='font-size:13px; font-weight:900; color:#000000; margin-bottom:0px; text-decoration: underline;'>{res['name']} {'⭐' if (res['name'] == ref_model) else ''}</p>", unsafe_allow_html=True)
+                st.markdown(f"**{row['model name']}**")
+                d_val = round(row['dry a']*x_input + row['dry b'], 1)
+                w_val = round(row['wet a']*x_input + row['wet b'], 1)
+                
                 if condition_view in ["Both", "Dry only"]:
-                    dv = round(res['dry'], 1)
-                    st.metric("Dry Perf.", f"{dv} N", f"{dv - round(ref_dry_val, 1):+.1f} N" if enable_comparison and not (res['name'] == ref_model) else None)
+                    st.metric("Dry", f"{d_val}N", f"{d_val-round(ref_d,1):+.1f}N Vs Ref" if enable_comparison and row['model name']!=ref_model else None)
                 if condition_view in ["Both", "Wet only"]:
-                    wv = round(res['wet'], 1)
-                    st.metric("Wet Perf.", f"{wv} N", f"{wv - round(ref_wet_val, 1):+.1f} N" if enable_comparison and not (res['name'] == ref_model) else None)
-                if show_loss and condition_view == "Both":
-                    loss_pct = ((res['dry'] - res['wet']) / res['dry'] * 100) if res['dry'] != 0 else 0
-                    st.metric("Wet Loss", f"-{round(loss_pct, 1)}%", delta_color="inverse")
-
+                    st.metric("Wet", f"{w_val}N", f"{w_val-round(ref_w,1):+.1f}N Vs Ref" if enable_comparison and row['model name']!=ref_model else None)
+                if show_loss and condition_view=="Both":
+                    loss = ((d_val - w_val) / d_val * 100) if d_val != 0 else 0
+                    st.metric("Loss", f"-{round(loss,1)}%", f"{round(w_val-d_val,1)}N vs Dry", delta_color="inverse")
 except Exception as e:
     st.error(f"Error: {e}")