fix(footer,nav): left-justify buttons, drop per-page caption bar, hide sidebar Close
Three small follow-ups to the sticky-footer rework:
- Left-justify the footer buttons (and reposition the Help popover
to anchor at the left edge so it lines up with its trigger).
- Remove the per-page ``st.divider() + st.caption("Runs locally…")``
trailing block from all 9 tool pages. The new sticky footer
covers that text, so it was rendering as an empty white bar at
the bottom of each tool page.
- Hide the Close entry from the sidebar nav via CSS. The page stays
registered with st.navigation so /close is still routable for the
sticky-footer Close button — only the sidebar link + its section
header are hidden (via :has() on stNavSection).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -60,6 +60,24 @@ header[data-testid="stHeader"] {
|
||||
footer {
|
||||
display: none !important;
|
||||
}
|
||||
/* Hide the "Close" entry from the sidebar nav — the page is kept
|
||||
registered so the sticky-footer Close link can still route to
|
||||
/close, but the sidebar entry is redundant and risks mis-clicks. */
|
||||
[data-testid="stSidebarNav"] a[href$="/close"],
|
||||
[data-testid="stSidebarNav"] a[href$="/close/"] {
|
||||
display: none !important;
|
||||
}
|
||||
/* Hide the entire "Close" section so its header label doesn't
|
||||
orphan above the hidden link. Streamlit tags each nav section
|
||||
with ``data-testid="stNavSection"``; the :has() selector picks
|
||||
only the one containing the close link. Modern browsers (Chrome
|
||||
105+, Safari 15.4+, Firefox 121+) all support it; older
|
||||
browsers fall back to showing the empty header, which is
|
||||
visually harmless. */
|
||||
[data-testid="stSidebarNav"] [data-testid="stNavSection"]:has(a[href$="/close"]),
|
||||
[data-testid="stSidebarNav"] [data-testid="stNavSection"]:has(a[href$="/close/"]) {
|
||||
display: none !important;
|
||||
}
|
||||
/* Reclaim top padding lost from hidden header. Slim the bottom too —
|
||||
Streamlit's default leaves several rems below the last widget. */
|
||||
.stAppViewBlockContainer,
|
||||
@@ -572,7 +590,7 @@ def render_sticky_footer() -> None:
|
||||
z-index: 2147483646 !important;
|
||||
display: flex !important;
|
||||
align-items: center !important;
|
||||
justify-content: flex-end !important;
|
||||
justify-content: flex-start !important;
|
||||
gap: 0.4rem !important;
|
||||
font-family: system-ui, -apple-system, sans-serif !important;
|
||||
box-sizing: border-box !important;
|
||||
@@ -605,7 +623,7 @@ def render_sticky_footer() -> None:
|
||||
}
|
||||
#datatools-help-popover {
|
||||
position: fixed !important;
|
||||
right: 0.75rem !important;
|
||||
left: 0.75rem !important;
|
||||
bottom: 44px !important;
|
||||
background: white !important;
|
||||
border: 1px solid rgba(49, 51, 63, 0.25) !important;
|
||||
|
||||
Reference in New Issue
Block a user