fix: improve Grid.js table header alignment and column min-width
- Add default minWidth (100px) to all grid columns via normalizeGridColumns to prevent header truncation when data entries are short - Fix inconsistent th heights by setting .gridjs-th-content line-height to 24px (matching the sort button height) so sortable and non-sortable columns render at uniform height - Remove dead button.gridjs-sort height:15px rule (was overridden by 24px) Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -55,6 +55,8 @@ const uniqueColumnId = (candidate, usedIds, fallbackPrefix = 'col') => {
|
||||
return next;
|
||||
};
|
||||
|
||||
const DEFAULT_MIN_WIDTH = '100px';
|
||||
|
||||
const normalizeGridColumns = (columns, sortColumns) => {
|
||||
const source = Array.isArray(columns) ? columns : [];
|
||||
const sortKeys = Array.isArray(sortColumns) ? sortColumns : [];
|
||||
@@ -69,7 +71,11 @@ const normalizeGridColumns = (columns, sortColumns) => {
|
||||
const label = typeof baseColumn.name === 'string' ? baseColumn.name : '';
|
||||
const fallback = `col_${index + 1}`;
|
||||
const id = uniqueColumnId(explicitId || sortKey || label || fallback, usedIds, fallback);
|
||||
return { ...baseColumn, id };
|
||||
|
||||
const skipMinWidth = baseColumn.hidden || baseColumn.plugin || baseColumn.minWidth;
|
||||
const minWidth = skipMinWidth ? baseColumn.minWidth : DEFAULT_MIN_WIDTH;
|
||||
|
||||
return { ...baseColumn, id, ...(minWidth ? { minWidth } : {}) };
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user