Browse Source

Fix PDF preview to have full width, close at top, and improve viewing at mobile.

Thanks to xet7 !
Lauri Ojansivu 2 years ago
parent
commit
4be5727a18
1 changed files with 6 additions and 12 deletions
  1. 6 12
      client/components/cards/attachments.css

+ 6 - 12
client/components/cards/attachments.css

@@ -96,7 +96,8 @@
   text-align: center;
   text-align: center;
 }
 }
 #pdf-viewer {
 #pdf-viewer {
-  width: 40vw;
+  margin-top: 4vh;
+  width: 100%;
   height: 100vh;
   height: 100vh;
 }
 }
 .pdf-preview-error{
 .pdf-preview-error{
@@ -105,18 +106,7 @@
   font-size: 2em;
   font-size: 2em;
   color: white;
   color: white;
 }
 }
-@media screen and (max-width: 1600px) {
-  #pdf-viewer {
-    width: 60vw;
-  }
-}
-
 @media screen and (max-width: 800px) {
 @media screen and (max-width: 800px) {
-
-  #pdf-viewer {
-    width: 100vh;
-  }
-
   .attachments-gallery .attachment-item {
   .attachments-gallery .attachment-item {
     width: 48%;
     width: 48%;
   }
   }
@@ -128,6 +118,10 @@
   }
   }
 }
 }
 @media screen and (max-width: 360px) {
 @media screen and (max-width: 360px) {
+  #pdf-viewer {
+    margin-top: 5vh;
+    width: 100%;
+  }
   .attachments-gallery .attachment-item {
   .attachments-gallery .attachment-item {
     width: 100%;
     width: 100%;
   }
   }