michael/ProdDash
1
0
Fork 0
Code Issues Pull Requests 3 Actions Packages Projects Releases 1 Wiki Activity

Grid Size: the stepper's row is a name and a number

Browse Source 
The Layouts menu row reads "Grid Size  − 12 +": the label is the setting's
name, the readout is the bare column count, and the default/finer/coarser
caption under the label is gone. The buttons keep their tooltips.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
This commit is contained in:
Waters Church
2026-09-22 11:35:26 -04:00
co-authored by Claude Fable 5.1
parent e383070a9e
commit 7ca65a845f
3 changed files with 6 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/shell.js
+3 -8
View File
@@ -328,18 +328,14 @@ function setGridCols(value, { save = true } = {}) {
const STEP_MINUS_SVG = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.6" stroke-linecap="round" aria-hidden="true"><path d="M5 12h14"/></svg>';
const STEP_PLUS_SVG = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.6" stroke-linecap="round" aria-hidden="true"><path d="M12 5v14M5 12h14"/></svg>';
/** The Layouts menu's density row — − 12 columns + — which steps without
/** The Layouts menu's density row — Grid Size − 12 + — which steps without
closing the menu, so the board can be watched changing behind it. */
function gridStepper() {
const row = document.createElement('div');
row.className = 'menu-stepper';
const label = document.createElement('span');
label.className = 'menu-stepper-label';
const name = document.createElement('span');
name.textContent = 'Grid';
const sub = document.createElement('span');
sub.className = 'sub';
label.append(name, sub);
label.textContent = 'Grid Size';
const minus = document.createElement('button');
minus.type = 'button';
minus.className = 'menu-stepper-btn';
@@ -354,8 +350,7 @@ function gridStepper() {
plus.innerHTML = STEP_PLUS_SVG;
const paint = () => {
const i = GRID_STEPS.indexOf(COLS);
value.textContent = `${COLS} columns`;
sub.textContent = COLS === GRID_DEFAULT ? 'default' : COLS < GRID_DEFAULT ? 'coarser' : 'finer';
value.textContent = String(COLS);
minus.disabled = i <= 0;
plus.disabled = i >= GRID_STEPS.length - 1;
};
public/style.css
+2 -3
View File
@@ -188,7 +188,7 @@ body.menu-hidden #topbar {
}
.menu-divider { height: 1px; background: var(--border); margin: 5px 4px; }
/* the Layouts menu's grid-density row: − 12 columns + */
/* the Layouts menu's grid-density row: Grid Size − 12 + */
.menu-stepper {
display: flex;
align-items: center;
@@ -197,7 +197,6 @@ body.menu-hidden #topbar {
font-size: 13px;
}
.menu-stepper-label { flex: 1; }
.menu-stepper-label .sub { display: block; color: var(--muted); font-size: 11px; margin-top: 2px; }
.menu-stepper-btn {
width: 26px;
height: 26px;
@@ -214,7 +213,7 @@ body.menu-hidden #topbar {
.menu-stepper-btn[disabled] { opacity: 0.35; cursor: default; }
.menu-stepper-btn svg { width: 12px; height: 12px; display: block; }
.menu-stepper-value {
min-width: 86px;
min-width: 28px;
text-align: center;
font-variant-numeric: tabular-nums;
}