Fix image sizing when image is very tall

client/components/cards/attachments.css

@@ -78,7 +78,7 @@
   width: 100%;
   height: 100vh;
   position: fixed;
-  top: 48px;  /* height of the navbar */
+  top: 0;
   left: 0;
   z-index: 9999 !important;
   background: rgba(13,13,13,0.95);
@@ -116,21 +116,28 @@
   align-self: center;
   margin: 0 20px;
 }
+#viewer-content {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: calc(100% - 50px);
+}
 #image-viewer {
   background:
     repeating-conic-gradient(#808080 0% 25%, transparent 0% 50%)
       50% / 20px 20px; /* Checkerboard background for transparent images */
-  max-width: 100%;
-  max-height: 100%;
+      max-width: 100%;
+      max-height: 100%;
 }
 #pdf-viewer {
   width: 40vw;
-  height: 100vh;
+  height: 100%;
 }
 #txt-viewer{
   background-color: white;
   width: 40vw;
-  height: 100vh;
+  height: 100%;
 }
 .pdf-preview-error {
   margin-top: 20vh;