| import streamlit as st | |
| # Inspect the header element, go to the "Computed" tab in styles, and find its height. | |
| #HEADER_HEIGHT = "60px" # EXAMPLE: Adjust this (e.g., "56px", "4rem") | |
| #HEADER_SELECTOR = 'header[data-testid="stHeader"]' | |
| # ---- SELECTOR FOR THE MAIN CONTENT AREA THAT NEEDS PADDING ---- | |
| # Target the first direct div child of the stAppViewContainer which often holds the main scrollable content | |
| #MAIN_CONTENT_SELECTOR = 'section[data-testid="stMain"]' | |
| #MAIN_CONTENT_SELECTOR = 'section[data-testid="stMain"] > div:nth-child(1)' | |
| #MAIN_CONTENT_SELECTOR = 'section[data-testid="stMainBlockContainer"]' | |
| #MAIN_CONTENT_SELECTOR = 'section[data-testid="stAppViewContainer"]' | |
| #MAIN_CONTENT_SELECTOR = 'section[data-testid="stAppViewContainer"] > div:nth-child(1)' | |
| # Alternative if the above doesn't work or if your content is further nested: | |
| #MAIN_CONTENT_SELECTOR = 'section[data-testid="stAppViewContainer"] .main-content-wrapper-class' | |
| # Or, very commonly, Streamlit wraps main content in a div with class "block-container": | |
| #MAIN_CONTENT_SELECTOR = 'section[data-testid="stAppViewContainer"] .block-container' | |
| #MAIN_CONTENT_SELECTOR = '.main .block-container' # A more general selector for block-container | |
| ''' | |
| custom_css = f""" | |
| <style> | |
| /* Making the Streamlit header sticky */ | |
| {HEADER_SELECTOR} {{ | |
| position: -webkit-sticky !important; /* For Safari */ | |
| position: sticky !important; | |
| top: 0 !important; | |
| z-index: 9999 !important; /* Very high z-index */ | |
| background-color: #90EE90 !important; /* Or your app's header background color */ | |
| /* Add a subtle shadow to make it feel more distinct when content scrolls under */ | |
| /* box-shadow: 0 2px 4px -1px rgba(0,0,0,0.1); */ | |
| /*.reportview-container .main .block-container{{ */ | |
| /* padding-top: 0rem; */ | |
| /* }} */ | |
| }} | |
| /* Adding padding to the main content area to prevent overlap with the sticky header */ | |
| {MAIN_CONTENT_SELECTOR} {{ | |
| padding-top: 10px !important; /* {HEADER_HEIGHT} !important; */ | |
| /* background-color: yellow !important; */ | |
| /* border-style: solid !important; */ | |
| /* border-color: red !important; */ | |
| }} | |
| /* Optional: If your app is set to wide mode and the header isn't spanning full width */ | |
| /* This might be needed if the sticky positioning affects its width calculation. */ | |
| /* | |
| #{HEADER_SELECTOR} {{ | |
| # width: 100% !important; | |
| #}} | |
| #*/ | |
| </style> | |
| """ | |
| ''' | |
| # Inject CSS as early as possible in your app | |
| #st.markdown(custom_css, unsafe_allow_html=True) | |
| # --- PAGE SETUP --- | |
| type_text_page = st.Page( | |
| page="pages/type_text.py", | |
| title="DEMO (work in progress)", | |
| icon=":material/keyboard:", | |
| default=True,) | |
| # --- Your Streamlit App --- | |
| #st.logo(image="images/menu_book_60dp_75FBFD.png") | |
| #st.title("Map descriptions to SBS codes with Sentence Transformer + Reasoning") | |
| #st.subheader("Select specific Chapter for quicker results") | |
| #st.logo(image="images/menu_book_60dp_75FBFD.png") | |
| #t.sidebar.header("SBS V2.0 mapper") | |
| #st.sidebar.write("(work in progress)") | |
| #t.sidebar.text("Demo by JA-RAD") | |
| # --- NAVIGATION SETUP --- | |
| #pg = st.navigation(pages=[type_text_page]) # WITHOUT SECTIONS | |
| ##pg = st.navigation({"Chapter_Index": [start_page], "Demo": [type_text_page, upload_file_page], "About": [about_page]}) # WITH SECTIONS | |
| #pg.run() | |
| if __name__ == "__main__": | |
| #st.title("Map descriptions to SBS codes with Sentence Transformer + Reasoning") | |
| #st.subheader("Select specific Chapter for quicker results") | |
| #st.logo(image="images/menu_book_60dp_75FBFD.png") | |
| #st.sidebar.header("SBS V2.0 mapper") | |
| #st.sidebar.write("(work in progress)") | |
| #st.sidebar.text("Demo by JA-RAD") | |
| pg = st.navigation(pages=[type_text_page]) # WITHOUT SECTIONS | |
| pg.run() |