Enhance UI with custom tab styling and replace tab implementation with a segmented control for better user experience.

src/streamlit_app.py

@@ -12,6 +12,43 @@ from database import init_conn
     
 gcservice_account, gcservice_account2, NHL_Data = init_conn()
 
+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)
+
 @st.cache_resource(ttl = 600)
 def init_baselines():
     sh = gcservice_account.open_by_url(NHL_Data)
@@ -161,9 +198,17 @@ indv_players = gamelog_table.drop_duplicates(subset='Player')
 total_players = indv_players.Player.values.tolist()
 total_dates = gamelog_table.Date.values.tolist()
 
-tab1, tab2 = st.tabs(['Gamelogs', 'Correlation Matrix'])
+selected_tab = st.segmented_control(
+    "Select Tab",
+    options=['Gamelogs', 'Correlation Matrix'],
+    selection_mode='single',
+    default='Gamelogs',
+    width='stretch',
+    label_visibility='collapsed',
+    key='tab_selector'
+)
 
-with tab1:
+if selected_tab == 'Gamelogs':
     col1, col2 = st.columns([1, 9])
     with col1:
         if st.button("Reset Data", key='reset1'):
@@ -282,7 +327,7 @@ with tab1:
                     mime='text/csv',
             )
             
-with tab2:
+elif selected_tab == 'Correlation Matrix':
     col1, col2 = st.columns([1, 9])
     with col1:
         if st.button("Reset Data", key='reset2'):