Update pages/type_text.py

pages/type_text.py

@@ -10,144 +10,6 @@ import os
 os.getenv("HF_TOKEN") 
 
 
-# --- PAGE CONFIG (Optional: Must be the first Streamlit command) ---
-# st.set_page_config(layout="wide") # Example: Use wide mode
-
-# --- NAVIGATION LOGIC ---
-# Initialize session state for page navigation if it doesn't exist
-if "page" not in st.session_state:
-    st.session_state.page = "Home"
-
-# Function to change the current page
-def set_page(page_name):
-    st.session_state.page = page_name
-
-# --- CSS FOR STICKY NAVBAR ---
-# You might need to adjust 'top' if Streamlit's default header is visible
-# and you want your navbar to be below it. Streamlit's header is approx 3rem-3.5rem.
-# If you've hidden Streamlit's default header, 'top: 0;' should work.
-# Let's assume Streamlit's default header IS visible for this example.
-STREAMLIT_DEFAULT_HEADER_HEIGHT = "3.5rem" # Approximate
-
-# Define the CSS for the sticky navbar
-# We will wrap our Streamlit columns/buttons in a div with class "sticky-navbar-container"
-navbar_style = f"""
-    <style>
-        .sticky-navbar-container {{
-            position: sticky;
-            top: {STREAMLIT_DEFAULT_HEADER_HEIGHT}; /* Stick below Streamlit's default header */
-            background-color: #FFFFFF; /* Or your app's background color e.g. #F0F2F6 */
-            z-index: 1001; /* High z-index to keep it on top */
-            padding: 0.75rem 1rem; /* Adjust padding as needed */
-            box-shadow: 0 2px 4px -1px rgba(0,0,0,0.1); /* Optional: subtle shadow */
-            border-bottom: 1px solid #E0E0E0; /* Optional: subtle border */
-            width: 100%; /* Ensure it spans the full width */
-        }}
-        /* Optional: Style for the buttons for a more 'navbar' look */
-        .sticky-navbar-container .stButton>button {{
-            border: none; /* Remove default button border */
-            padding: 0.5rem 1rem; /* Adjust button padding */
-            margin: 0 0.25rem; /* Spacing between buttons */
-            /* background-color: transparent; */ /* Make button background transparent */
-            /* color: #31333F; */ /* Set text color */
-            font-weight: 500;
-        }}
-        .sticky-navbar-container .stButton>button:hover {{
-            /* background-color: #E0E0E0; */ /* Hover effect */
-            /* color: #000000; */
-        }}
-        .sticky-navbar-container .stButton>button:focus {{
-            /* outline: 2px solid #007bff; */ /* Focus outline */
-            /* box-shadow: none; */
-        }}
-        /* Style for an active-like button (if you want to highlight current page) */
-        .sticky-navbar-container .stButton.active-button>button {{
-            /* background-color: #007bff; */
-            /* color: white; */
-            font-weight: bold;
-            border-bottom: 2px solid #007BFF; /* Example active indicator */
-        }}
-
-    </style>
-"""
-st.markdown(navbar_style, unsafe_allow_html=True)
-
-# --- NAVBAR HTML STRUCTURE ---
-# Start the div container for the navbar
-st.markdown('<div class="sticky-navbar-container">', unsafe_allow_html=True)
-
-# Create columns for navigation items
-# Adjust the column ratios as needed, e.g., for a logo or app title
-nav_cols = st.columns([1, 1, 1, 1, 3]) # 4 nav items, 1 larger space for title/logo
-
-# Navigation buttons
-with nav_cols[0]:
-    # Add 'active-button' class conditionally for styling
-    active_class = "active-button" if st.session_state.page == "Home" else ""
-    if st.button("🏠 Home", on_click=set_page, args=("Home",), use_container_width=True, key="nav_home", type="secondary"): # type can be "primary" or "secondary"
-        pass # on_click handles the logic
-    # Applying class via JS hack (if needed, st.button doesn't directly support class attribute)
-    if active_class: st.markdown(f"<script>document.querySelector('[data-testid=\"stButton\"] button[key*=\"nav_home\"]').closest('.stButton').classList.add('{active_class}');</script>", unsafe_allow_html=True)
-
-
-with nav_cols[1]:
-    active_class = "active-button" if st.session_state.page == "Dashboard" else ""
-    if st.button("📈 Dashboard", on_click=set_page, args=("Dashboard",), use_container_width=True, key="nav_dashboard"):
-        pass
-    if active_class: st.markdown(f"<script>document.querySelector('[data-testid=\"stButton\"] button[key*=\"nav_dashboard\"]').closest('.stButton').classList.add('{active_class}');</script>", unsafe_allow_html=True)
-
-
-with nav_cols[2]:
-    active_class = "active-button" if st.session_state.page == "Settings" else ""
-    if st.button("⚙️ Settings", on_click=set_page, args=("Settings",), use_container_width=True, key="nav_settings"):
-        pass
-    if active_class: st.markdown(f"<script>document.querySelector('[data-testid=\"stButton\"] button[key*=\"nav_settings\"]').closest('.stButton').classList.add('{active_class}');</script>", unsafe_allow_html=True)
-
-
-with nav_cols[3]:
-    active_class = "active-button" if st.session_state.page == "About" else ""
-    if st.button("👤 About", on_click=set_page, args=("About",), use_container_width=True, key="nav_about"):
-        pass
-    if active_class: st.markdown(f"<script>document.querySelector('[data-testid=\"stButton\"] button[key*=\"nav_about\"]').closest('.stButton').classList.add('{active_class}');</script>", unsafe_allow_html=True)
-
-
-# Optional: App title or logo in the navbar
-with nav_cols[4]:
-    st.markdown("<h3 style='text-align:right; margin:0; padding-top:0.1rem;'>My Sticky App</h3>", unsafe_allow_html=True)
-
-# Close the div container for the navbar
-st.markdown('</div>', unsafe_allow_html=True)
-
-
-# --- MAIN PAGE CONTENT ---
-# Display content based on the selected page
-if st.session_state.page == "Home":
-    st.header("🏠 Home Page")
-    st.write("Welcome to the home page! This navbar will stick to the top as you scroll.")
-    for i in range(50):
-        st.write(f"Home: Scrollable content line {i+1}")
-elif st.session_state.page == "Dashboard":
-    st.header("📈 Dashboard")
-    st.write("This is your main dashboard. Notice the sticky navigation.")
-    for i in range(50):
-        st.write(f"Dashboard: Scrollable content line {i+1}")
-elif st.session_state.page == "Settings":
-    st.header("⚙️ Settings")
-    st.write("Configure your application settings here.")
-    for i in range(50):
-        st.write(f"Settings: Scrollable content line {i+1}")
-elif st.session_state.page == "About":
-    st.header("👤 About Us")
-    st.write("Information about this application and its sticky navigation feature.")
-    for i in range(50):
-        st.write(f"About: Scrollable content line {i+1}")
-
-# --- FOOTER (Example) ---
-st.markdown("---")
-st.write("This is the footer of the page.")
-
-
-
 #hide_streamlit_style = """
 #        <style>
 #        div[data-testid="stHeader"] {