From b475e7d6edebd44459a25cfbadf1950b67a62325 Mon Sep 17 00:00:00 2001 From: retoor Date: Tue, 8 Sep 2026 21:02:45 +0200 Subject: [PATCH] Revert sticky-column max-height capping - it truncated shorter columns The previous fix (d88b3cea) gave every sticky sidebar/rail a viewport-derived max-height + internal overflow-y:auto so a tall column's content couldn't get skipped during a fast sticky unstick. That solved reachability but broke something more visible: on any page where a side column is naturally SHORTER than the page's tallest column (the common case - main content usually exceeds the sidebars), the row/page still grows to the tallest column's height, but the capped side column's own box now stops at its cap and never continues, leaving a large empty gap below it for the remainder of the row. On the reported post page this cut "Related Discussions"/"Projects from" off mid-list with dead space underneath, i.e. the site was no longer "at least as long as its longest section" in the sense that mattered: a shorter section's own rendered box stopped short of the room the page actually had for it. Verified empirically (not just by reasoning about sticky/grid semantics, which are easy to get wrong) that plain `position: sticky` with no cap already guarantees every part of a column becomes visible at some point during ordinary page scroll, for any pair of column heights on a page whose main content is bounded (post, profile, leaderboard, docs, quiz scoreboard) - the browser's native stuck -> released transition is smooth and passes the element's full content through the viewport once its own natural height's worth of scroll distance has elapsed, regardless of how much taller the other columns are. Removed max-height/overflow-y/overscroll-behavior/scrollbar- hiding from .sidebar-card, .feed-right, .leaderboard-page > aside, .post-page-sidebar, .profile-sidebar, and .dashboard-sidebar, back to plain sticky; simplified the nested-.sidebar-card overrides (needed only to stop double-nested stickiness) to just `position: static`. .ds-chat-log and .pf-tree keep their scrollbar-hiding - those are genuinely bounded, self-contained widget panes (not page-scroll sticky columns) and were never part of this problem. Verified on the exact reported URL (devplace.net/posts/ 607ebbd19b95-...): document height now matches the tallest column (1494px, driven by the 1265px main column), every one of the 11 related-title entries across all three sidebar sections becomes visible during a full incremental scroll, and the full-page screenshot shows no truncation or dead space. Also verified full reachability (every item seen, nothing capped) on profile, leaderboard, docs nav, and the quiz scoreboard. Known residual trade-off, not fixed here: on a page whose main column is effectively unbounded (the feed's post listing), a side column taller than one viewport only fully reveals its tail in the scroll range immediately before the very end of that (very long) page, which real users rarely reach. Fixing that would need an actual independent-scroll-pane architecture (JS-driven), not a CSS-only sticky pattern, and reintroduces the same capped/dead-space trade-off this commit just removed - flagging it rather than silently overclaiming full coverage. Co-Authored-By: Claude Sonnet 5 Claude-Session: https://claude.ai/code/session_01Vnp7vzE4hvsytMo5YjszJm --- devplacepy/static/css/feed.css | 22 ---------------------- devplacepy/static/css/landing.css | 10 ---------- devplacepy/static/css/post.css | 12 ------------ devplacepy/static/css/profile.css | 10 ---------- devplacepy/static/css/sidebar.css | 10 ---------- pyproject.toml | 2 +- 6 files changed, 1 insertion(+), 65 deletions(-) diff --git a/devplacepy/static/css/feed.css b/devplacepy/static/css/feed.css index e554bb7..e2584ea 100644 --- a/devplacepy/static/css/feed.css +++ b/devplacepy/static/css/feed.css @@ -221,25 +221,13 @@ .feed-right { position: sticky; top: calc(var(--nav-height) + 1rem); - max-height: calc(100vh - var(--nav-height) - 2rem); - overflow-y: auto; - overscroll-behavior: contain; - scrollbar-width: none; - -ms-overflow-style: none; display: flex; flex-direction: column; gap: 1rem; } -.feed-right::-webkit-scrollbar { - width: 0; - height: 0; -} - .feed-right .sidebar-card { position: static; - max-height: none; - overflow: visible; } .daily-topic-card { @@ -509,16 +497,6 @@ .leaderboard-page > aside { position: sticky; top: calc(var(--nav-height) + 1rem); - max-height: calc(100vh - var(--nav-height) - 2rem); - overflow-y: auto; - overscroll-behavior: contain; - scrollbar-width: none; - -ms-overflow-style: none; -} - -.leaderboard-page > aside::-webkit-scrollbar { - width: 0; - height: 0; } .leaderboard-main { diff --git a/devplacepy/static/css/landing.css b/devplacepy/static/css/landing.css index 05a671e..88178aa 100644 --- a/devplacepy/static/css/landing.css +++ b/devplacepy/static/css/landing.css @@ -272,16 +272,6 @@ gap: 1rem; position: sticky; top: 5rem; - max-height: calc(100vh - 5rem - 1rem); - overflow-y: auto; - overscroll-behavior: contain; - scrollbar-width: none; - -ms-overflow-style: none; -} - -.dashboard-sidebar::-webkit-scrollbar { - width: 0; - height: 0; } .dashboard-sidebar-card { diff --git a/devplacepy/static/css/post.css b/devplacepy/static/css/post.css index 723a262..1fb89fa 100644 --- a/devplacepy/static/css/post.css +++ b/devplacepy/static/css/post.css @@ -13,22 +13,10 @@ gap: 1rem; position: sticky; top: calc(var(--nav-height) + 1rem); - max-height: calc(100vh - var(--nav-height) - 2rem); - overflow-y: auto; - overscroll-behavior: contain; - scrollbar-width: none; - -ms-overflow-style: none; -} - -.post-page-sidebar::-webkit-scrollbar { - width: 0; - height: 0; } .post-page-sidebar .sidebar-card { position: static; - max-height: none; - overflow: visible; } .post-page { diff --git a/devplacepy/static/css/profile.css b/devplacepy/static/css/profile.css index 9071a72..13c947a 100644 --- a/devplacepy/static/css/profile.css +++ b/devplacepy/static/css/profile.css @@ -10,19 +10,9 @@ .profile-sidebar { position: sticky; top: calc(var(--nav-height) + 1rem); - max-height: calc(100vh - var(--nav-height) - 2rem); - overflow-y: auto; - overscroll-behavior: contain; - scrollbar-width: none; - -ms-overflow-style: none; min-width: 0; } -.profile-sidebar::-webkit-scrollbar { - width: 0; - height: 0; -} - .profile-card { background: var(--bg-card); border: 1px solid var(--border); diff --git a/devplacepy/static/css/sidebar.css b/devplacepy/static/css/sidebar.css index 6a7f526..fd90320 100644 --- a/devplacepy/static/css/sidebar.css +++ b/devplacepy/static/css/sidebar.css @@ -3,11 +3,6 @@ .sidebar-card { position: sticky; top: calc(var(--nav-height) + 1rem); - max-height: calc(100vh - var(--nav-height) - 2rem); - overflow-y: auto; - overscroll-behavior: contain; - scrollbar-width: none; - -ms-overflow-style: none; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-lg); @@ -15,11 +10,6 @@ padding: 1rem; } -.sidebar-card::-webkit-scrollbar { - width: 0; - height: 0; -} - .sidebar-card .sidebar-heading { font-size: 0.75rem; font-weight: 700; diff --git a/pyproject.toml b/pyproject.toml index f456abd..a523147 100644 --- a/pyproject.toml +++ b/pyproject.toml @@ -1,6 +1,6 @@ [project] name = "devplacepy" -version = "1.0.12" +version = "1.0.13" description = "DevPlace - The Developer Social Network" requires-python = ">=3.12" dependencies = [