update tiling button for imageviewer.js to use an icon in same style as others, add mouseover hints

This commit is contained in:
AUTOMATIC 2022-09-21 14:22:16 +03:00
parent 390ead187c
commit 1ebb5cc669
2 changed files with 8 additions and 4 deletions

View file

@ -148,18 +148,21 @@ document.addEventListener("DOMContentLoaded", function() {
modalZoom.className = 'modalZoom cursor';
modalZoom.innerHTML = '⤡'
modalZoom.addEventListener('click', modalZoomToggle, true)
modalZoom.title = "Toggle zoomed view";
modalControls.appendChild(modalZoom)
const modalTileImage = document.createElement('button')
modalTileImage.className = 'modalTileImage gr-button gr-button-lg gr-button-secondary';
modalTileImage.innerHTML = 'Preview Image Tiling'
const modalTileImage = document.createElement('span')
modalTileImage.className = 'modalTileImage cursor';
modalTileImage.innerHTML = '⊞'
modalTileImage.addEventListener('click', modalTileImageToggle, true)
modalTileImage.title = "Preview tiling";
modalControls.appendChild(modalTileImage)
const modalClose = document.createElement('span')
modalClose.className = 'modalClose cursor';
modalClose.innerHTML = '×'
modalClose.onclick = closeModal;
modalClose.title = "Close image viewer";
modalControls.appendChild(modalClose)
const modalImage = document.createElement('img')

View file

@ -272,7 +272,8 @@ input[type="range"]{
}
.modalClose,
.modalZoom {
.modalZoom,
.modalTileImage {
color: white;
font-size: 35px;
font-weight: bold;