From 3cc3fadecbc8d818913fe7698075215f20649721 Mon Sep 17 00:00:00 2001 From: Jeffrey Lewis Date: Mon, 7 Sep 2026 20:50:13 +0000 Subject: [PATCH] Stop the vote-count sidebar chart from sticking below the md breakpoint $("#vote_chart_float").stick_in_parent() pins the vote page's party vote-count bar chart to the viewport as you scroll past it, so it stays visible alongside the member vote list below. That's fine at >=992px where the two columns sit side by side, but Bootstrap stacks them to full width below that -- so the "stuck" chart became a full-width bar fixed to the top of the viewport, floating directly over the member list as it scrolled underneath. Gate the sticky behavior on window width (>=992px, matching the Bootstrap md breakpoint where the columns are actually side by side), and detach/reattach it on resize so someone resizing the window mid- scroll doesn't get stuck in a broken state either way. Verified with headless Chromium (Playwright) at 375/768/900/992/1280px, scrolling the full height of a rollcall page and checking the chart's bounding box against the vote list's at every 100px of scroll: no overlap at any sampled position after the fix (previously overlapped at 375/768/900px), desktop sticky behavior at >=992px is unchanged, and a resize across the breakpoint mid-scroll correctly attaches/ detaches with no console or page errors. Co-Authored-By: Claude Sonnet 5 Claude-Session: https://claude.ai/code/session_013KJMYfgTNsxrmjHZpZKAHT --- static/js/voteCharts.js | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/static/js/voteCharts.js b/static/js/voteCharts.js index 63f6e6fec..a5fabb8eb 100644 --- a/static/js/voteCharts.js +++ b/static/js/voteCharts.js @@ -597,7 +597,20 @@ function drawWidgets(error, data, geodata, usaboundaries) } }); - $("#vote_chart_float").delay(500).stick_in_parent(); + // Only stick the vote-count chart to the viewport when its column sits + // beside the vote list (Bootstrap's md breakpoint, >=992px). Below that + // the columns stack, so a "stuck" full-width chart would end up pinned + // on top of the vote list underneath it as the page scrolls. + function updateVoteChartSticky() { + var $float = $("#vote_chart_float"); + if ($(window).width() >= 992) { + if (!$float.data("sticky_kit")) { $float.stick_in_parent(); } + } else if ($float.data("sticky_kit")) { + $float.trigger("sticky_kit:detach"); + } + } + $(window).on("resize", updateVoteChartSticky); + setTimeout(updateVoteChartSticky, 500); }