mikael-lovqvists-claude-agent/electronics-inventory
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix grid viewer zoom: use CSS zoom so images and text scale together

Browse Source 
Cells stay 1fr (always fill width), CSS zoom shrinks the whole grid
uniformly. No overflow.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
mikael-lovqvists-claude-agent
2026-03-21 01:15:05 +00:00
parent 878b32f9e5
commit faed2f8296
3 changed files with 6 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
public/app.mjs
View File

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