From 3c16ce517e32c91a6c72240c89b7e125287d8873 Mon Sep 17 00:00:00 2001 From: LarsFlem <43146722+LarsFlem@users.noreply.github.com> Date: Wed, 23 Oct 2024 13:54:18 +0200 Subject: [PATCH] Update PDF.css --- src/components/PDF.css | 41 ++++++++++++++++++++++++++++------------- 1 file changed, 28 insertions(+), 13 deletions(-) diff --git a/src/components/PDF.css b/src/components/PDF.css index 74295f7..1d387ba 100644 --- a/src/components/PDF.css +++ b/src/components/PDF.css @@ -1,29 +1,44 @@ -/* PDF Viewer Container */ .pdf-viewer-container { width: 100%; - max-width: 70%; /* Max width for large screens */ - margin: 0 auto; /* Center the PDF viewer */ + margin: 0 auto; padding: 1rem; - box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); /* Add a subtle shadow */ + box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); border-radius: 8px; - background-color: #f9f9f9; /* Light background */ + background-color: #f9f9f9; } -/* Title styling */ .pdf-viewer-container h2 { text-align: center; - font-family: "Space Grotesk", sans-serif; /* Use the preferred font */ + font-family: "Space Grotesk", sans-serif; color: #333; margin-bottom: 20px; font-size: 1.8rem; } -/* Styling the object or iframe (the PDF content) */ -.pdf-viewer-container object, -.pdf-viewer-container iframe { +/* Default behavior for desktops */ +.pdf-viewer-container object { width: 100%; - border: none; /* Remove default borders */ + height: 100vh; + border: none; border-radius: 8px; - overflow: hidden; /* Ensure no scrolling */ - height: 100vh; /* Placeholder for full height adjustment */ +} + +/* Mobile and smaller devices */ +@media (max-width: 768px) { + .pdf-viewer-container object { + height: auto; /* Let the height be automatic */ + max-height: 80vh; /* Ensure it doesn't exceed the viewport */ + width: 100%; + overflow: scroll; + } + + .pdf-viewer-container iframe { + height: auto; + width: 100%; + overflow: scroll; + } + + .pdf-viewer-container { + padding: 1rem; + } }