client, css: image-overlay: fix sizing images w/o thumbs

2 files changed, 6 insertions, 0 deletions

diff --git a/src/static/css/site.css b/src/static/css/site.css
index d1d7f5f6..643fcae4 100644
--- a/src/static/css/site.css
+++ b/src/static/css/site.css
@@ -3200,6 +3200,10 @@ main.long-content .content-sticky-heading-container .content-sticky-subheading-r
   position: absolute;
 }
 
+#image-overlay-container.no-thumb #image-overlay-image {
+  position: static;
+}
+
 #image-overlay-image-thumb {
   filter: blur(16px);
   transform: scale(1.5);
diff --git a/src/static/js/client/image-overlay.js b/src/static/js/client/image-overlay.js
index a914d97c..da192178 100644
--- a/src/static/js/client/image-overlay.js
+++ b/src/static/js/client/image-overlay.js
@@ -226,9 +226,11 @@ async function loadOverlayImage(details) {
   if (details.thumbSrc) {
     info.thumbImage.src = details.thumbSrc;
     info.thumbImage.style.display = null;
+    info.container.classList.remove('no-thumb');
   } else {
     info.thumbImage.src = '';
     info.thumbImage.style.display = 'none';
+    info.container.classList.add('no-thumb');
   }
 
   // Show the thumbnail size on each <img> element's data attributes.