diff --git a/src/components/PDF.tsx b/src/components/PDF.tsx index caba512..f90ed78 100644 --- a/src/components/PDF.tsx +++ b/src/components/PDF.tsx @@ -1,32 +1,51 @@ -import React, { useEffect, useRef } from "react"; +import React, { useEffect, useRef, useState } from "react"; import "./PDF.css"; import CV_PDF from "./_PDF/Lars_Flem_CV_english.pdf"; const PdfViewer: React.FC = () => { - const pdfRef = useRef(null); + const [isIOS, setIsIOS] = useState(false); + const pdfRef = useRef(null); useEffect(() => { - if (pdfRef.current) { - const windowHeight = window.innerHeight; + const userAgent = window.navigator.userAgent; - if (window.innerWidth > 768) { - // Set height dynamically for larger screens - pdfRef.current.style.height = `${windowHeight - 150}px`; // Adjust as needed - } else { - // On mobile, allow scrolling and set auto height - pdfRef.current.style.height = "auto"; - } + // Detect iOS (iPhone/iPad) + if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) { + setIsIOS(true); } }, []); return (

CV

- -

- PDF cannot be displayed. Download the PDF. -

-
+ + {isIOS ? ( + // Use an iframe for iOS devices or a link as a fallback + + ) : ( + // Use the object element for non-iOS devices + +

+ PDF cannot be displayed. Download the PDF. +

+
+ )}
); };