[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,35 +15,33 @@ 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">
-        <div className="flex flex-row items-center justify-between p-4">
+        <Button
-          <Button
+          disabled={pageNumber === 1}
-            disabled={pageNumber === 1}
+          icon={ArrowLeftIcon}
-            icon={ArrowLeftIcon}
+          isLabelHidden={true}
-            isLabelHidden={true}
+          label="Previous"
-            label="Previous"
+          variant="tertiary"
-            variant="tertiary"
+        />
-          />
+        <p className="text-md text-gray-600">
-          <p className="text-md text-gray-600">
+          Page {pageNumber} of {numPages}
-            Page {pageNumber} of {numPages}
+        </p>
-          </p>
+        <Button
-          <Button
+          disabled={pageNumber === numPages}
-            disabled={pageNumber === numPages}
+          icon={ArrowRightIcon}
-            icon={ArrowRightIcon}
+          isLabelHidden={true}
-            isLabelHidden={true}
+          label="Next"
-            label="Next"
+          variant="tertiary"
-            variant="tertiary"
+        />
-          />
-        </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