File size: 1,848 Bytes
d8f56b1 53dcb25 bee7cf0 ce47786 bee7cf0 ce47786 bee7cf0 ce47786 bee7cf0 ce47786 bee7cf0 ce47786 bee7cf0 fe2d7a3 ce47786 561774a 57dfc0c 9176e69 9f0fc30 057e688 b50938f 9038e9e b47a09c 9038e9e 057e688 957d115 057e688 fe5cb7d |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 |
import streamlit as st
# Set page config
st.set_page_config(page_title="Fixed Top Toolbar", layout="wide")
# CSS to fix the entire top toolbar
st.markdown("""
<style>
/* Target the entire header/toolbar section */
header[data-testid="stHeader"],
header.css-18ni7ap.e8zbici2,
.stApp > header {
position: fixed !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
height: auto !important;
z-index: 999999 !important;
background-color: white !important;
box-shadow: 0 1px 5px rgba(0,0,0,0.1) !important;
}
/* Add padding to main content to prevent it being hidden under fixed header */
.main .block-container {
padding-top: 3rem !important;
}
/* Make sure status widget appears above other elements */
[data-testid="stStatusWidget"] {
z-index: 1000000 !important;
}
</style>
""", unsafe_allow_html=True)
# Your regular Streamlit app content
st.title("App with Fixed Top Toolbar")
st.write("Scroll down to test if the toolbar and status widget stay fixed")
# Generate content for scrolling
for i in range(30):
st.write(f"Testing content line {i}")
if i % 5 == 0:
st.markdown("---")
# --- SHARED ON ALL PAGES ---
st.logo(image="images/menu_book_60dp_75FBFD.png")
st.sidebar.title("SBS V2.0 mapper")
st.sidebar.subheader("(work in progress)")
st.sidebar.text("Demo by JA-RAD")
# --- PAGE SETUP ---
type_text_page = st.Page(
page="pages/type_text.py",
title="DEMO (work in progress)",
icon=":material/keyboard:",
default=True,)
# --- 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() |