Add custom styling and segmented control for tab navigation in streamlit_app.py

src/streamlit_app.py

@@ -11,6 +11,43 @@ from database import props_db, dfs_db
 game_format = {'Win%': '{:.2%}', 'Vegas': '{:.2%}', 'Win% Diff': '{:.2%}'}
 american_format = {'First Inning Lead Percentage': '{:.2%}', 'Fifth Inning Lead Percentage': '{:.2%}'}
 
+st.markdown("""
+<style>
+    /* Tab styling */
+    .stElementContainer [data-baseweb="button-group"] {
+        gap: 2.000rem;
+        padding: 4px;
+    }
+    .stElementContainer [kind="segmented_control"] {
+        height: 2.000rem;
+        white-space: pre-wrap;
+        background-color: #DAA520;
+        color: white;
+        border-radius: 20px;
+        gap: 1px;
+        padding: 10px 20px;
+        font-weight: bold;
+        transition: all 0.3s ease;
+    }
+    .stElementContainer [kind="segmented_controlActive"] {
+        height: 3.000rem;
+        background-color: #DAA520;
+        border: 3px solid #FFD700;
+        border-radius: 10px;
+        color: black;
+    }
+    .stElementContainer [kind="segmented_control"]:hover {
+        background-color: #FFD700;
+        cursor: pointer;
+    }
+
+    div[data-baseweb="select"] > div {
+        background-color: #DAA520;
+        color: white;
+    }
+
+</style>""", unsafe_allow_html=True)
+
 def calculate_poisson(row):
     mean_val = row['Mean_Outcome']
     threshold = row['Prop']
@@ -88,6 +125,9 @@ def calculate_no_vig(row):
     
     return no_vig_prob
 
+def convert_df_to_csv(df):
+    return df.to_csv().encode('utf-8')
+
 game_model, overall_stats, timestamp, prop_frame, prop_trends, pick_frame, market_props = init_baselines()
 qb_stats = overall_stats[overall_stats['Position'] == 'QB']
 qb_stats = qb_stats.drop_duplicates(subset=['Player', 'Position'])
@@ -107,10 +147,17 @@ sim_all_hold = pd.DataFrame(columns=['Player', 'Team', 'Book', 'Prop Type', 'Pro
 
 tab1, tab2, tab3, tab4, tab5, tab6, tab7 = st.tabs(["Game Betting Model", 'Prop Market', "QB Projections", "RB/WR/TE Projections", "Player Prop Trends", "Player Prop Simulations", "Stat Specific Simulations"])
 
-def convert_df_to_csv(df):
-    return df.to_csv().encode('utf-8')
-
-with tab1:
+selected_tab = st.segmented_control(
+    "Select Tab",
+    options=["Game Betting Model", 'Prop Market', "QB Projections", "RB/WR/TE Projections", "Player Prop Trends", "Player Prop Simulations", "Stat Specific Simulations"],
+    selection_mode='single',
+    default='Game Betting Model',
+    width='stretch',
+    label_visibility='collapsed',
+    key='tab_selector'
+)
+
+with selected_tab == 'Game Betting Model':
     st.info(t_stamp)
     if st.button("Reset Data", key='reset1'):
               st.cache_data.clear()
@@ -143,7 +190,7 @@ with tab1:
         key='team_export',
     )
 
-with tab2:
+with selected_tab == 'Prop Market':
     st.info(t_stamp)
     if st.button("Reset Data", key='reset4'):
               st.cache_data.clear()
@@ -183,7 +230,7 @@ with tab2:
         mime='text/csv',
     )
 
-with tab3:
+with selected_tab == 'QB Projections':
     st.info(t_stamp)
     if st.button("Reset Data", key='reset2'):
               st.cache_data.clear()
@@ -211,7 +258,7 @@ with tab3:
         key='NFL_qb_stats_export',
     )
 
-with tab4:
+with selected_tab == 'RB/WR/TE Projections':
     st.info(t_stamp)
     if st.button("Reset Data", key='reset3'):
               st.cache_data.clear()
@@ -239,7 +286,7 @@ with tab4:
         key='NFL_nonqb_stats_export',
     )
 
-with tab5:
+with selected_tab == 'Player Prop Trends':
     st.info(t_stamp)
     if st.button("Reset Data", key='reset5'):
               st.cache_data.clear()
@@ -270,7 +317,7 @@ with tab5:
         mime='text/csv',
     )
 
-with tab6:
+with selected_tab == 'Player Prop Simulations':
     st.info(t_stamp)
     if st.button("Reset Data", key='reset6'):
               st.cache_data.clear()
@@ -420,7 +467,7 @@ with tab6:
                             plot_hold_container = st.empty()
                             st.plotly_chart(fig, use_container_width=True)
 
-with tab7:
+with selected_tab == 'Stat Specific Simulations':
     st.info(t_stamp)
     st.info('The Over and Under percentages are a compositve percentage based on simulations, historical performance, and implied probabilities, and may be different than you would expect based purely on the median projection. Likewise, the Edge of a bet is not the only indicator of if you should make the bet or not as the suggestion is using a base acceptable threshold to determine how much edge you should have for each stat category.')
     if st.button("Reset Data/Load Data", key='reset7'):