From ce1a359f31e675e8bb01f71922e6f9d48635b9e6 Mon Sep 17 00:00:00 2001
From: spaceyuck <oss@spassshuttle.de>
Date: Thu, 19 Mar 2026 23:29:11 +0100
Subject: [PATCH] sidebar move selected / excluded filter options into collapse
 header element

the goal is to keep selected options visble when scrolling, not just the section header

Squashed commit of the following:

commit b9fe590aa12cacb625b7fb73e57b5a16926c45c2
Author: spaceyuck <oss@spassshuttle.de>
Date:   Thu Oct 30 22:00:48 2025 +0100

    sidebar move selected / excluded filter options into collapse header element

    the goal is to keep selected options visble when scrolling, not just the
    section header

commit 91ec37baf2d9a8c339600f8b4f0ba42b363aaf3e
Author: WithoutPants <53250216+WithoutPants@users.noreply.github.com>
Date:   Thu Oct 30 13:22:32 2025 +1100

    Remove max-height and sticky sidebar section headers
---
 ui/v2.5/src/components/List/styles.scss          | 6 ++++--
 ui/v2.5/src/components/Shared/CollapseButton.tsx | 2 +-
 ui/v2.5/src/components/Shared/styles.scss        | 6 ++++--
 3 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/ui/v2.5/src/components/List/styles.scss b/ui/v2.5/src/components/List/styles.scss
index cccd73cb2..da63c4d9a 100644
--- a/ui/v2.5/src/components/List/styles.scss
+++ b/ui/v2.5/src/components/List/styles.scss
@@ -214,6 +214,10 @@ input[type="range"].zoom-slider {
   }
 }
 
+.sidebar-saved-filter-list-container .saved-filter-list {
+  max-height: unset;
+}
+
 .sidebar-saved-filter-list-container .toolbar {
   align-items: center;
   display: flex;
@@ -618,8 +622,6 @@ ul.selectable-list {
 .folder-filter ul {
   list-style-type: none;
   margin-bottom: 0.25rem;
-  max-height: 300px;
-  overflow-y: auto;
   // to prevent unnecessary vertical scrollbar
   padding-bottom: 0.15rem;
   padding-inline-start: 0;
diff --git a/ui/v2.5/src/components/Shared/CollapseButton.tsx b/ui/v2.5/src/components/Shared/CollapseButton.tsx
index fe8330a9c..246204e40 100644
--- a/ui/v2.5/src/components/Shared/CollapseButton.tsx
+++ b/ui/v2.5/src/components/Shared/CollapseButton.tsx
@@ -44,8 +44,8 @@ export const CollapseButton: React.FC<React.PropsWithChildren<IProps>> = (
           <Icon icon={open ? faChevronDown : faChevronRight} fixedWidth />
           <span>{props.text}</span>
         </Button>
+        {props.outsideCollapse}
       </div>
-      {props.outsideCollapse}
       <Collapse in={open} {...props.collapseProps}>
         <div>{props.children}</div>
       </Collapse>
diff --git a/ui/v2.5/src/components/Shared/styles.scss b/ui/v2.5/src/components/Shared/styles.scss
index 21e6eb696..fa82868fd 100644
--- a/ui/v2.5/src/components/Shared/styles.scss
+++ b/ui/v2.5/src/components/Shared/styles.scss
@@ -1002,9 +1002,11 @@ button.btn.favorite-button {
   border-bottom: 1px solid $secondary;
 
   .collapse-header {
-    // background-color: $secondary;
-
+    background-color: $body-bg;
     padding: 0.25rem;
+    position: sticky;
+    top: -0.5rem;
+    z-index: 1;
 
     .collapse-button {
       font-weight: bold;