From a1e028bfc5baa02ff10dcba0003a81fe00d8c0e0 Mon Sep 17 00:00:00 2001
From: r-zakarya <82443831+r-zakarya@users.noreply.github.com>
Date: Wed, 22 Jul 2026 06:51:52 +0100
Subject: [PATCH] fix(table): right-align the column-picker header cell

The gear hugged the left edge of the (width:100%) actions column because the
header th, unlike the body cells, has no col-actions class / text-align:right.
Set textAlign right on the actions header cell so the picker sits in the
top-right corner.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 js/app.js | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/js/app.js b/js/app.js
index 8d7cf13..5817362 100644
--- a/js/app.js
+++ b/js/app.js
@@ -3241,8 +3241,13 @@ function renderTable(list) {
             th.appendChild(el('span', null, col.label));
         }
         // Column picker lives in the table's own header corner (it only makes
-        // sense in table view), not the global toolbar.
-        if (col.key === 'actions') th.appendChild(buildColsPicker());
+        // sense in table view), not the global toolbar. The actions column is
+        // width:100% in the body, so right-align the header cell too — else the
+        // gear hugs the left edge of that wide column instead of the corner.
+        if (col.key === 'actions') {
+            th.style.textAlign = 'right';
+            th.appendChild(buildColsPicker());
+        }
         headerRow.appendChild(th);
     });
     thead.appendChild(headerRow);