File size: 2,443 Bytes
d8f56b1
53dcb25
bee7cf0
c3ae9df
 
 
 
 
 
 
 
 
 
 
 
bee7cf0
c3ae9df
 
 
 
 
 
 
 
 
 
 
 
 
bee7cf0
c3ae9df
 
 
 
 
 
 
 
 
 
 
 
 
 
 
bee7cf0
 
c3ae9df
 
bee7cf0
c3ae9df
bee7cf0
fe2d7a3
 
 
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
62
63
64
65
66
67
68
69
70
71
72
73
import streamlit as st 

# Set page config
st.set_page_config(page_title="JavaScript Status Widget Fix", layout="wide")

# JavaScript approach to fix the status widget position
js_code = """
<script>
// Function to fix the position of the status widget
function fixStatusWidget() {
    // Try to find the status widget using different possible selectors
    const statusWidget = 
        document.querySelector('[data-testid="stStatusWidget"]') || 
        document.querySelector('.stStatusWidget') ||
        document.querySelector('button[kind="formSubmit"]').closest('div').closest('div');
    
    if (statusWidget) {
        // Set fixed positioning
        statusWidget.style.position = 'fixed';
        statusWidget.style.top = '10px';
        statusWidget.style.right = '10px';
        statusWidget.style.zIndex = '1000000';
        statusWidget.style.backgroundColor = 'white';
        statusWidget.style.borderRadius = '4px';
        statusWidget.style.boxShadow = '0 0 10px rgba(0,0,0,0.2)';
        statusWidget.style.padding = '4px';
        console.log('Status widget positioned successfully');
    } else {
        console.log('Status widget not found, will retry');
    }
}

// Try to fix the widget immediately
fixStatusWidget();

// Also run after a delay to make sure the DOM is fully loaded
setTimeout(fixStatusWidget, 1000);

// Continue checking periodically in case the widget gets recreated
setInterval(fixStatusWidget, 2000);
</script>
"""

# Inject the JavaScript
st.components.v1.html(js_code, height=0)

# Your regular Streamlit app content
st.title("App with JavaScript-Fixed Status Widget")
st.write("Scroll down to see if the status widget stays fixed")

# Generate content for scrolling test
for i in range(30):
    st.write(f"Testing content line {i}")
    if i % 10 == 0:
        st.markdown("### Section Break")

# --- 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()