Update app.py

app.py

@@ -2,35 +2,26 @@ import streamlit as st
 
 st.title('Togglable Sidebar Example')
 
-# Apply CSS to hide the sidebar initially or based on session state
-if 'hide_sidebar' not in st.session_state:
-    st.session_state.hide_sidebar = True
-
-hide_css = """
-<style>
-    div[data-testid="stSidebar"][aria-expanded="true"] > div:first-child {
-        display: none !important;
-    }
-</style>
-"""
-
-show_css = """
+# This is the CSS to hide the sidebar
+css_code = """
 <style>
-    div[data-testid="stSidebar"][aria-expanded="true"] > div:first-child {
-        display: block !important;
+    [data-testid="stSidebar"] {
+        display: none;
     }
 </style>
 """
 
-if st.session_state.hide_sidebar:
-    st.markdown(hide_css, unsafe_allow_html=True)
-else:
-    st.markdown(show_css, unsafe_allow_html=True)
+# Initialize the session state variable if it doesn't exist
+if 'show_sidebar' not in st.session_state:
+    st.session_state.show_sidebar = False
 
-# Toggle sidebar visibility
-if st.button('Toggle Sidebar'):
-    st.session_state.hide_sidebar = not st.session_state.hide_sidebar
+if st.button("Toggle Sidebar"):
+    st.session_state.show_sidebar = not st.session_state.show_sidebar
 
-# Just add your sidebar items as usual, and they will be hidden/shown based on the toggle state
-st.sidebar.title('Sidebar')
-st.sidebar.write('This is the sidebar content.')
+# If we want to show the sidebar, we'll use Streamlit's standard sidebar functions.
+# If we want to hide it, we'll inject the CSS code to hide the sidebar.
+if st.session_state.show_sidebar:
+    st.sidebar.title("Sidebar")
+    st.sidebar.write("This is the sidebar content.")
+else:
+    st.markdown(css_code, unsafe_allow_html=True)