Remove grid viewer zoom slider — browser zoom is sufficient

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-21 01:15:52 +00:00
parent faed2f8296
commit 754f8504f1
3 changed files with 2 additions and 30 deletions

View File

@@ -1190,14 +1190,9 @@ function render_grid_viewer() {
} }
)); ));
const zoom_el = document.getElementById('gv-zoom');
const cells_el = document.getElementById('grid-cells'); const cells_el = document.getElementById('grid-cells');
cells_el.style.gridTemplateColumns = `repeat(${grid.cols}, 1fr)`; cells_el.style.gridTemplateColumns = `repeat(${grid.cols}, 1fr)`;
zoom_el.addEventListener('input', () => {
cells_el.style.zoom = zoom_el.value / 100;
});
const all_cells = grid.cells.flat().map((filename, idx) => { const all_cells = grid.cells.flat().map((filename, idx) => {
const row = Math.floor(idx / grid.cols); const row = Math.floor(idx / grid.cols);
const col = idx % grid.cols; const col = idx % grid.cols;

View File

@@ -1333,27 +1333,10 @@ nav {
.grid-viewer-actions { .grid-viewer-actions {
display: flex; display: flex;
align-items: center;
gap: 0.5rem; gap: 0.5rem;
flex-shrink: 0; flex-shrink: 0;
} }
.gv-zoom-label {
display: flex;
align-items: center;
gap: 0.4rem;
font-size: 0.8rem;
color: var(--text-dim);
}
.gv-zoom-label input[type=range] {
width: 100px;
accent-color: var(--accent);
}
.grid-cells-wrap {
overflow: hidden;
}
.grid-cells { .grid-cells {
display: grid; display: grid;

View File

@@ -355,19 +355,13 @@
<div class="viewer-meta"></div> <div class="viewer-meta"></div>
</div> </div>
<div class="grid-viewer-actions"> <div class="grid-viewer-actions">
<label class="gv-zoom-label">
<span>Size</span>
<input type="range" id="gv-zoom" min="20" max="100" value="100" step="5">
</label>
<button class="btn btn-secondary" id="gv-back">← Back</button> <button class="btn btn-secondary" id="gv-back">← Back</button>
<button class="btn btn-secondary" id="gv-edit-panels">Edit panels</button> <button class="btn btn-secondary" id="gv-edit-panels">Edit panels</button>
<button class="btn btn-danger" id="gv-delete">Delete</button> <button class="btn btn-danger" id="gv-delete">Delete</button>
</div> </div>
</div> </div>
<div class="grid-cells-wrap">
<div class="grid-cells" id="grid-cells"></div> <div class="grid-cells" id="grid-cells"></div>
</div> </div>
</div>
</template> </template>
<template id="t-grid-cell"> <template id="t-grid-cell">