[resumes][fix] Manually calculate height for pdf view instead

apps/portal/src/components/global/AppShell.tsx

@@ -112,7 +112,7 @@ export default function AppShell({ children }: Props) {
   const [mobileMenuOpen, setMobileMenuOpen] = useState(false);
 
   return (
-    <div className="flex h-screen">
+    <div className="flex h-full min-h-screen">
       {/* Narrow sidebar */}
       <div className="hidden w-28 overflow-y-auto bg-indigo-700 md:block">
         <div className="flex w-full flex-col items-center py-6">

apps/portal/src/components/resumes/ResumePdf.tsx

@@ -15,16 +15,15 @@ export default function ResumePdf() {
   };
 
   return (
-    <div className="flex h-full flex-col">
+    <div>
       <Document
-        className="max-h-full basis-5/6 overflow-y-scroll"
+        className="h-[calc(100vh-17rem)] overflow-scroll"
         file="/test_resume.pdf"
         loading={<Spinner display="block" label="" size="lg" />}
         onLoadSuccess={onPdfLoadSuccess}>
         <Page pageNumber={pageNumber} />
       </Document>
 
-      <div className="basis-1/6">
       <div className="flex flex-row items-center justify-between p-4">
         <Button
           disabled={pageNumber === 1}
@@ -45,6 +44,5 @@ export default function ResumePdf() {
         />
       </div>
     </div>
-    </div>
   );
 }

apps/portal/src/pages/resumes/review.tsx

@@ -12,7 +12,7 @@ import ResumePdf from '~/components/resumes/ResumePdf';
 
 export default function ResumeReviewPage() {
   return (
-    <main className="h-full w-full flex-1 p-4">
+    <main className="flex-1 p-4">
       <div className="flex flex-row md:space-x-8">
         <h1 className="text-2xl font-bold leading-7 text-gray-900 sm:truncate sm:text-3xl sm:tracking-tight">
           Please help moi, applying for medtech startups in Singapore