From 86376284f4e5a1815ed648054637b487e4022a9d Mon Sep 17 00:00:00 2001 From: Will Miao Date: Fri, 7 Aug 2026 16:53:04 +0800 Subject: [PATCH] fix(ui): clamp filter panel height to viewport --- static/css/components/search-filter.css | 1 + static/js/utils/uiHelpers.js | 2 ++ 2 files changed, 3 insertions(+) diff --git a/static/css/components/search-filter.css b/static/css/components/search-filter.css index 6d42988b..728311d9 100644 --- a/static/css/components/search-filter.css +++ b/static/css/components/search-filter.css @@ -152,6 +152,7 @@ box-shadow: var(--shadow-md); z-index: var(--z-overlay); padding: 16px; + box-sizing: border-box; /* Include padding in max-height calculation */ transition: transform 0.3s ease, opacity 0.3s ease; transform-origin: top right; max-height: calc(100vh - 70px); /* Adjusted for header height */ diff --git a/static/js/utils/uiHelpers.js b/static/js/utils/uiHelpers.js index 5e1763f6..1cacd9ab 100644 --- a/static/js/utils/uiHelpers.js +++ b/static/js/utils/uiHelpers.js @@ -356,6 +356,8 @@ export function updatePanelPositions() { if (filterPanel) { filterPanel.style.top = `${topPosition}px`; + // Clamp panel height to the viewport below the header + filterPanel.style.maxHeight = `calc(100vh - ${topPosition + 10}px)`; } // Adjust panel horizontal position based on the search container