giteadmin/datatools-dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(footer): close white gap by stretching stAppViewContainer

Browse Source 
Color-tag diagnostic confirmed the bottom-of-viewport strip was
painted by ``stAppViewContainer`` (it showed GREEN), not by the
block container as the previous two attempts assumed. ``.stApp``
has ``zoom: 0.85`` so 100vh visually renders at 85% — apply
``min-height: calc(100vh / 0.85)`` to the view container itself so
it spans the full visible viewport and there is no gap for its own
background to leak through as a "white bar". Reverts the diagnostic
tints (RED/BLUE/GREEN/GOLD); keeps the 2rem block-container
padding-bottom that reserves room for the fixed footer overlay.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Michael
2026-05-18 22:36:41 +00:00
parent 2fe324279e
commit e011c0b6e6
1 changed files with 11 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
src/gui/components/_legacy.py
View File

@@ -628,26 +628,19 @@ def render_sticky_footer() -> None:
st.markdown( st.markdown(
""" """
<style> <style>
/* DIAGNOSTIC: tint every plausible bottom-area container so we can /* The view container is the element whose background paints the
see WHICH element is actually filling the visible bottom of the strip between the last piece of content and the fixed footer
page. Whichever color shows in the "white bar" region is the overlay (confirmed via colored-tag diagnostic). ``.stApp`` carries
element to fix. To be reverted once the right target is known. */ ``zoom: 0.85`` so 100vh renders at 85% visually — divide by 0.85
[data-testid="stAppViewBlockContainer"] { so the container spans the full visible viewport and there's no
background: #ff5050 !important; /* RED = block container */ gap for its own background to show through as a "white bar". */
min-height: calc(100vh / 0.85) !important;
padding-bottom: 2rem !important;
box-sizing: border-box !important;
}
[data-testid="stMain"],
section[data-testid="stMain"] {
background: #50c0ff !important; /* BLUE = stMain */
min-height: 100vh !important;
}
[data-testid="stAppViewContainer"] { [data-testid="stAppViewContainer"] {
background: #50ff80 !important; /* GREEN = view container */ min-height: calc(100vh / 0.85) !important;
} }
.stApp { [data-testid="stAppViewBlockContainer"] {
background: #ffd000 !important; /* GOLD = .stApp (zoomed) */ /* Reserve room for the fixed footer overlay (footer min-height
32px + 0.25rem * 2 padding ≈ 2rem). */
padding-bottom: 2rem !important;
} }
#datatools-sticky-footer { #datatools-sticky-footer {
position: fixed !important; position: fixed !important;