Improve gallery layout Closes #2907

061ed1db65dca2a6fc3b6a127a72c0bdb41b1aa7

Cohee <18619528+Cohee1207@users.noreply.github.com>

public/scripts/extensions/gallery/index.js+5 -5 Viewed

 let paginationMaxLinesPerPage = 2;
 let galleryMaxRows = 3;
-$('body').on('click', '.dragClose', function () {
+$('#movingDivs').on('click', '.dragClose', function () {
     const relatedId = $(this).data('related-id');  // Get the ID of the related draggable
-    $(`body > .draggable[id="${relatedId}"]`).remove();  // Remove the associated draggable
+    $(`#movingDivs > .draggable[id="${relatedId}"]`).remove();  // Remove the associated draggable
 });
 const CUSTOM_GALLERY_REMOVED_EVENT = 'galleryRemoved';

     $('#dragGallery').css('display', 'block');
-    $('body').append(newElement);
+    $('#movingDivs').append(newElement);
     loadMovingUIState();
     $(`.draggable[forChar="${id}"]`).css('display', 'block');

@@ -362,8 +362,8 @@ function makeDragImg(id, url) {
362	}	362	}
363	}	363	}
364		364
365	// Step 3: Attach it to the body	365	// Step 3: Attach it to the movingDivs container
366	document.body.appendChild(newElement);	366	document.getElementById('movingDivs').appendChild(newElement);
367		367
368	// Step 4: Call dragElement and loadMovingUIState	368	// Step 4: Call dragElement and loadMovingUIState
369	const appendedElement = document.getElementById(uniqueId);	369	const appendedElement = document.getElementById(uniqueId);

public/style.css+0 -7 Viewed

 /* Jank mobile support for gallery and future draggables */
 @media screen and (max-width: 1000px) {
-    #gallery {
-        display: block;
-        width: 100vw;
-        height: 100vh;
-        z-index: 9999;
-    }
     .draggable {
         display: block;
         width: 100vw;