Fix cell max-width, header z-order, and sort command palette
Some checks failed
Build / build-linux (push) Failing after 14s
Build / build-linux-webkit2_41 (push) Failing after 14s
Build / build-macos (push) Successful in 3m30s

- Cap cell and header max-width to 150px (was 200px for best-fit)
- Bump header z-index to 10 (row-number corner to 11) so sticky
  headers stay above data cells when scrolling horizontally
- Remove position:relative and z-index from cursor-cell so it no
  longer creates a stacking context that overlaps sticky headers
- Sort command palette entries alphabetically (case-insensitive)

Co-authored-by: Shelley <shelley@exe.dev>
This commit is contained in:
exe.dev user 2026-03-04 00:32:41 +00:00
parent af1629c58d
commit 9d56f5e8e2
2 changed files with 8 additions and 6 deletions

View file

@ -30,7 +30,7 @@ const tableContainer = $('#table-container');
// Default column width // Default column width
const DEFAULT_COL_WIDTH = 120; const DEFAULT_COL_WIDTH = 120;
const MIN_COL_WIDTH = 40; const MIN_COL_WIDTH = 40;
const MAX_BEST_FIT = 200; const MAX_BEST_FIT = 150;
// ===== Helpers ===== // ===== Helpers =====
function colLabel(i) { function colLabel(i) {
@ -630,7 +630,9 @@ let activeCommandIndex = 0;
function renderCommandList(filter) { function renderCommandList(filter) {
commandList.innerHTML = ''; commandList.innerHTML = '';
const lower = filter.toLowerCase(); const lower = filter.toLowerCase();
const filtered = commands.filter(c => c.Name.toLowerCase().includes(lower)); const filtered = commands
.filter(c => c.Name.toLowerCase().includes(lower))
.sort((a, b) => a.Name.toLowerCase().localeCompare(b.Name.toLowerCase()));
activeCommandIndex = 0; activeCommandIndex = 0;

View file

@ -88,7 +88,7 @@ html, body {
#table-head th { #table-head th {
position: sticky; position: sticky;
top: 0; top: 0;
z-index: 2; z-index: 10;
background: var(--header-bg); background: var(--header-bg);
border: 1px solid var(--border); border: 1px solid var(--border);
border-top: none; border-top: none;
@ -102,6 +102,7 @@ html, body {
cursor: default; cursor: default;
height: 26px; height: 26px;
font-size: 12px; font-size: 12px;
max-width: 150px;
} }
#table-head th.row-number-header { #table-head th.row-number-header {
@ -110,7 +111,7 @@ html, body {
max-width: var(--row-num-width); max-width: var(--row-num-width);
position: sticky; position: sticky;
left: 0; left: 0;
z-index: 3; z-index: 11;
text-align: center; text-align: center;
background: var(--header-bg); background: var(--header-bg);
} }
@ -166,6 +167,7 @@ th .header-edit-input {
height: 24px; height: 24px;
cursor: cell; cursor: cell;
font-size: 13px; font-size: 13px;
max-width: 150px;
} }
#table-body td.row-number { #table-body td.row-number {
@ -191,8 +193,6 @@ td.selected {
td.cursor-cell { td.cursor-cell {
outline: 2px solid var(--selected-border); outline: 2px solid var(--selected-border);
outline-offset: -1px; outline-offset: -1px;
z-index: 1;
position: relative;
} }
/* Status bar */ /* Status bar */