From 7ab233be2c527eec0db71eb05d3aebc1e125644f Mon Sep 17 00:00:00 2001
From: kodi <kodi@lab.local>
Date: Fri, 13 Mar 2026 12:19:13 +0100
Subject: [PATCH] feat: vaste kolomheaders

---
 webui/backend/data/tasks.db | Bin 110592 -> 110592 bytes
 webui/html/base.css         |  23 +++++++++++++++++------
 webui/html/index.html       |  28 ++++++++++++++++++----------
 3 files changed, 35 insertions(+), 16 deletions(-)

diff --git a/webui/backend/data/tasks.db b/webui/backend/data/tasks.db
index 13d4786d879392f369570083196e09737bc8fec4..5e55de77caf4f01ff73db69444d4673cb9accb15 100644
GIT binary patch
delta 63
zcmZp8z}E19ZGtpo^h6nF#^{X+%l|X7Z{=WQ=a-XYW7d={PR&V8E=f&^FUd&FO-(OK
TEXc?#No8PQ*sjaZczFQ;n=llw

delta 63
zcmZp8z}E19ZGtpo)I=F)#;A=6%l|X7Y~^5N=a-XVW7bqIPR&V8E=f&^FUd&FO-;)w
TP0cIO%}dSC+pf#cczFQ;qq`N#

diff --git a/webui/html/base.css b/webui/html/base.css
index c115314..e37dd50 100644
--- a/webui/html/base.css
+++ b/webui/html/base.css
@@ -105,11 +105,27 @@ h1 {
 .pane-content {
   flex: 1 1 auto;
   min-height: 0;
-  overflow-y: auto;
   border-top: 1px solid var(--color-border);
   padding-top: 5px;
   position: relative;
   background: var(--color-surface);
+  display: flex;
+  flex-direction: column;
+}
+
+.pane-list-header {
+  flex: 0 0 auto;
+  position: relative;
+  z-index: 2;
+  background: var(--color-surface);
+}
+
+.pane-list-scroll {
+  flex: 1 1 auto;
+  min-height: 0;
+  overflow-y: auto;
+  position: relative;
+  z-index: 1;
 }
 
 .pane-focus-line {
@@ -250,11 +266,6 @@ button:disabled {
   font-size: 11px;
   text-transform: uppercase;
   letter-spacing: 0.05em;
-  position: sticky;
-  top: 0;
-  z-index: 10;
-  isolation: isolate;
-  background-clip: padding-box;
   box-shadow:
     0 1px 0 rgba(0, 0, 0, 0.04),
     0 8px 10px -10px rgba(0, 0, 0, 0.45);
diff --git a/webui/html/index.html b/webui/html/index.html
index bbb7d91..99508f8 100644
--- a/webui/html/index.html
+++ b/webui/html/index.html
@@ -38,12 +38,16 @@
         </div>
 
         <div class="pane-content">
-          <div class="list-grid-header">
-            <span class="col-name">Name</span>
-            <span class="col-size">Size</span>
-            <span class="col-modified">Modified</span>
+          <div class="pane-list-header">
+            <div class="list-grid-header">
+              <span class="col-name">Name</span>
+              <span class="col-size">Size</span>
+              <span class="col-modified">Modified</span>
+            </div>
+          </div>
+          <div class="pane-list-scroll">
+            <ul id="left-items" class="list"></ul>
           </div>
-          <ul id="left-items" class="list"></ul>
         </div>
         <div id="left-focus-line" class="pane-focus-line" aria-live="polite">—</div>
       </section>
@@ -58,12 +62,16 @@
         </div>
 
         <div class="pane-content">
-          <div class="list-grid-header">
-            <span class="col-name">Name</span>
-            <span class="col-size">Size</span>
-            <span class="col-modified">Modified</span>
+          <div class="pane-list-header">
+            <div class="list-grid-header">
+              <span class="col-name">Name</span>
+              <span class="col-size">Size</span>
+              <span class="col-modified">Modified</span>
+            </div>
+          </div>
+          <div class="pane-list-scroll">
+            <ul id="right-items" class="list"></ul>
           </div>
-          <ul id="right-items" class="list"></ul>
         </div>
         <div id="right-focus-line" class="pane-focus-line" aria-live="polite">—</div>
       </section>