Merge pull request #8156 from bluelovers/pr/lightbox-001

feat: better lightbox when not enable zoom

javascript/imageviewer.js

@@ -11,7 +11,7 @@ function showModal(event) {
     if (modalImage.style.display === 'none') {
         lb.style.setProperty('background-image', 'url(' + source.src + ')');
     }
-    lb.style.display = "block";
+    lb.style.display = "flex";
     lb.focus()
 
     const tabTxt2Img = gradioApp().getElementById("tab_txt2img")

style.css

@@ -436,9 +436,7 @@ input[type="range"]{
 
 #modalImage {
     display: block;
-    margin-left: auto;
-    margin-right: auto;
-    margin-top: auto;
+    margin: auto;
     width: auto;
 }