fade out dimension labels for values < 5

Hunter
Tuesday, October 21st, 2025 at 5:52 PM


script.js+14-2


style.css+4 
script.js
251  	// Update dimension labels
252  	const widthLabel = img.container.querySelector('.dimension-label.width');
253  	const heightLabel = img.container.querySelector('.dimension-label.height');
    -	if (widthLabel) widthLabel.textContent = img.widthCells;
    -	if (heightLabel) heightLabel.textContent = img.heightCells;
254 +	if (widthLabel) {
255 +		// Only update text if dimension is >= 5
256 +		if (img.widthCells >= 5) {
257 +			widthLabel.textContent = img.widthCells;
258 +		}
259 +		widthLabel.dataset.hidden = img.widthCells < 5 ? 'true' : 'false';
260 +	}
261 +	if (heightLabel) {
262 +		// Only update text if dimension is >= 5
263 +		if (img.heightCells >= 5) {
264 +			heightLabel.textContent = img.heightCells;
265 +		}
266 +		heightLabel.dataset.hidden = img.heightCells < 5 ? 'true' : 'false';
267 +	}
268  
269  	// Recalculate baseScale if container size changed
270  	if (img.naturalWidth > 0 && img.naturalHeight > 0) {
style.css
278  	opacity: 1;
279  }
280  
281 +.dimension-label[data-hidden="true"] {
282 +	opacity: 0 !important;
283 +}
284 +
285  .resize-handle.corner {
286  	width: 10px;
287  	height: 10px;