Merge branch 'main' of https://git.csclub.uwaterloo.ca/www/www-new into feat/meet-the-team-page

components/TeamMemberCard.module.css

@@ -88,9 +88,11 @@
   display: flex;
   z-index: 12;
   flex-direction: column;
+  max-width: calc(768rem / 16);
+  height: 75vh;
+  overflow: auto;
   background-color: var(--secondary-background);
   padding: calc(20rem / 16) calc(40rem / 16);
-  left: 0;
   top: 50%;
   animation: popup 0.7s forwards;
 }
@@ -98,7 +100,6 @@
 .closeBtn {
   align-self: flex-end;
   /* reset default button styling */
-  width: min-content;
   background: transparent;
   border: 0px solid transparent;
   padding: 0;
@@ -158,4 +159,8 @@
   .description {
     display: none;
   }
+
+  .popupContainer {
+    left: 0;
+  }
 }

components/TeamMemberCard.tsx

@@ -79,6 +79,9 @@ interface Propup extends TeamMemberCardProps {
   handleClick: () => void;
 }
 
+// TODO: fix extra space at bottom of popup
+//       - this is due to height being specified in order to have scrolling
+
 function ExecPopup({ name, role, image, children, handleClick }: Propup) {
   return (
     <>