Update src/streamlit_app.py

src/streamlit_app.py

@@ -4,67 +4,55 @@ import os
 import numpy as np
 
 # ==============================================================================
-# 1. STYLE CSS V2.3 (FOCUS VISIBILITÉ TOTALE & BOUTONS)
+# 1. STYLE CSS V2.4 (FORÇAGE BLANC TOTAL SUR COMPOSANTS NOIRS)
 # ==============================================================================
-st.set_page_config(page_title="Brake Lab V2.3", layout="centered")
+st.set_page_config(page_title="Brake Lab V2.4", layout="centered")
 
 st.markdown("""
     <style>
     /* 1.1 FOND GLOBAL */
     .stApp { background-color: #FFFFFF !important; }
-    * { color: #000000 !important; font-family: 'Arial', sans-serif; }
     
-    /* 1.2 INPUTS NUMÉRIQUES : BLANC SUR NOIR + BOUTONS VISIBLES */
-    input[type="number"], .stNumberInput div[data-baseweb="input"] {
+    /* 1.2 FORÇAGE DES TEXTES DANS LES BLOCS NOIRS */
+    /* On cible tout ce qui est dans un input ou une liste déroulante */
+    div[data-baseweb="select"] *, 
+    input, 
+    .stNumberInput div *, 
+    div[role="listbox"] *,
+    .streamlit-expanderHeader * {
         color: #FFFFFF !important;
-        background-color: #1E1E1E !important;
-        border-radius: 8px !important;
-        font-weight: bold !important;
+        fill: #FFFFFF !important;
     }
-    
-    /* FORCE LA VISIBILITÉ DES BOUTONS + ET - */
-    button[aria-label="Step up"], button[aria-label="Step down"], button {
-        color: #FFFFFF !important;
-        background-color: #333333 !important;
-    }
-    button:hover { background-color: #0082C3 !important; }
 
-    /* 1.3 SELECTBOX : FIX VISIBILITÉ LORS DU CLIC */
-    div[data-baseweb="select"] {
+    /* 1.3 RÉGLAGE DES BOITES (NOIR) */
+    div[data-baseweb="select"], 
+    input, 
+    .stNumberInput div[data-baseweb="input"],
+    .streamlit-expanderHeader {
         background-color: #1E1E1E !important;
         border: 2px solid #000000 !important;
+        border-radius: 8px !important;
     }
-    
-    /* Texte sélectionné et curseur */
-    div[data-baseweb="select"] * {
-        color: #FFFFFF !important;
+
+    /* 1.4 TITRES HORS BLOCS (DOIVENT RESTER NOIRS SUR BLANC) */
+    h1, h2, h3, h4, p, label, .stMarkdown div p {
+        color: #000000 !important;
     }
 
-    /* Menu déroulant (Options) */
+    /* 1.5 LISTE DÉROULANTE (OPTIONS) */
     div[role="listbox"], ul[role="listbox"] {
         background-color: #1E1E1E !important;
-        border: 1px solid #FFFFFF !important;
-    }
-    
-    li[role="option"], li[role="option"] * {
-        color: #FFFFFF !important;
-        background-color: #1E1E1E !important;
-        font-weight: bold !important;
     }
-    
     li[role="option"]:hover {
         background-color: #0082C3 !important;
     }
 
-    /* 1.4 EXPANDERS : TITRES BIEN NOIRS SUR BLANC */
-    .streamlit-expanderHeader {
-        background-color: #F0F2F6 !important;
-        color: #000000 !important;
-        font-weight: bold !important;
-        border-radius: 8px !important;
+    /* 1.6 BOUTONS + ET - (BOINS VISIBLES) */
+    button[aria-label="Step up"], button[aria-label="Step down"] {
+        background-color: #333333 !important;
     }
 
-    /* 1.5 CARTES DE RÉSULTATS */
+    /* 1.7 CARTES DE RÉSULTATS */
     .perf-box {
         padding: 40px;
         border: 4px solid #000000;
@@ -77,8 +65,8 @@ st.markdown("""
     .perf-value { font-size: 55px; font-weight: 900; margin: 0px; }
     
     /* COULEURS COMPARAISON */
-    .comp-pos { color: #1B5E20 !important; font-weight: bold; font-size: 18px; margin-top: 10px; } /* Vert */
-    .comp-neg { color: #B71C1C !important; font-weight: bold; font-size: 18px; margin-top: 10px; } /* Rouge */
+    .comp-pos { color: #1B5E20 !important; font-weight: bold; font-size: 18px; margin-top: 10px; }
+    .comp-neg { color: #B71C1C !important; font-weight: bold; font-size: 18px; margin-top: 10px; }
     </style>
     """, unsafe_allow_html=True)
 
@@ -97,7 +85,7 @@ def load_data():
 df = load_data()
 
 # ==============================================================================
-# 3. INTERFACE V2.3
+# 3. INTERFACE V2.4
 # ==============================================================================
 if not df.empty:
     
@@ -127,11 +115,16 @@ if not df.empty:
     res_dry = row['dry a'] * effort_val + row['dry b']
     res_wet = row['wet a'] * effort_val + row['wet b']
 
+    res_dry_c, res_wet_c = None, None
+    if compare_model != "Aucun":
+        row_c = df[df['model name'] == compare_model].iloc[0]
+        res_dry_c = row_c['dry a'] * effort_val + row_c['dry b']
+        res_wet_c = row_c['wet a'] * effort_val + row_c['wet b']
+
     # --- AFFICHAGE ---
     st.write("") 
     res_c1, res_c2 = st.columns(2)
 
-    # Fonction pour générer le texte de comparaison en %
     def get_comp_html(val_main, val_comp):
         if val_comp is None: return ""
         diff_pct = ((val_main - val_comp) / val_comp) * 100
@@ -139,23 +132,16 @@ if not df.empty:
         sign = "+" if diff_pct >= 0 else ""
         return f'<p class="{color_class}">{sign}{round(diff_pct, 1)}% vs comp</p>'
 
-    # Calcul comparaison si nécessaire
-    res_dry_c, res_wet_c = None, None
-    if compare_model != "Aucun":
-        row_c = df[df['model name'] == compare_model].iloc[0]
-        res_dry_c = row_c['dry a'] * effort_val + row_c['dry b']
-        res_wet_c = row_c['wet a'] * effort_val + row_c['wet b']
-
     with res_c1:
         st.markdown(f"""<div class="perf-box">
-            <p style="font-size: 20px; font-weight: bold; color: #555 !important; margin-bottom:10px;">CONDITION : SEC</p>
+            <p style="font-size: 20px; font-weight: bold; margin-bottom:10px;">CONDITION : SEC</p>
             <p class="perf-value" style="color: #0082C3 !important;">{round(res_dry, 1)} N</p>
             {get_comp_html(res_dry, res_dry_c)}
         </div>""", unsafe_allow_html=True)
 
     with res_c2:
         st.markdown(f"""<div class="perf-box">
-            <p style="font-size: 20px; font-weight: bold; color: #555 !important; margin-bottom:10px;">CONDITION : HUMIDE</p>
+            <p style="font-size: 20px; font-weight: bold; margin-bottom:10px;">CONDITION : HUMIDE</p>
             <p class="perf-value" style="color: #E63312 !important;">{round(res_wet, 1)} N</p>
             {get_comp_html(res_wet, res_wet_c)}
         </div>""", unsafe_allow_html=True)