Update the team page for 2024 (#58)

* Protect sensitive payment or personal pages from scrapers

* Add 2024 team

* Update spacing

* Hide 1st year roles for 2024

* Rearrange directors by subcommittee name

* Update director titles

* Update IT subcommittee description

* Fix build

* Address PR comments

* Fix description

* Refactor description conditional for team page

components/nominations/NomineeModal.jsx

@@ -36,7 +36,7 @@ const NomineeModal = ({ data, roles, isOpen, toggle }) => {
           {data.description !== undefined &&
             data.description.split("\n").map((paragraph) => (
               <>
-                <p>{paragraph}</p>
+                <p className="px-3 px-md-4 px-lg-5">{paragraph}</p>
                 <br />
               </>
             ))}

components/team/ExecCard.jsx

@@ -3,27 +3,26 @@ import Image from "next/image";
 
 import styles from "styles/modules/ExecCard.module.scss";
 
-// TODO: consider separating into component that's more generic, and having
-// ExecCard inherit from that
+// TODO: consider separating into component that's more generic, and having ExecCard inherit from that
 const ExecCard = ({ data, colour }) => {
   const { name, image, description, role } = data;
 
-  // TODO: fix description not showing
   return (
     <div className="col-md-4">
       <div className="card-person">
         <div className={`${styles["card-person-style" + colour]} limit`}>
-          <div className={styles["card-person-animation"]} />
-          <Image alt={name} src={image} className="card-img-top" />
-          <div className={styles[`go-corner-style${colour}`]}>
-            <div className={styles["go-arrow"]} />
-          </div>
+          {description && (
+            <>
+              <div className={styles["card-person-animation"]} />
+              <p className={styles["person-text"]}>{description}</p>
+            </>
+          )}
+          <Image alt={name} src={image} className={styles["card-img-top"]} />
         </div>
       </div>
-      <div className="card-body text-center">
+      <div className="card-body text-center pt-2 pb-4">
         <h4 className="about-name">{name}</h4>
         {role === "" ? null : <p className="about-role">{role}</p>}
-        {/* {description === "" ? null : <p className={styles["person-text"]}>{description}</p>} */}
       </div>
     </div>
   );

components/team/ExecSection.jsx

@@ -22,7 +22,7 @@ const ExecSection = ({ section }) => {
   return (
     <>
       <hr />
-      <Row className="justify-content-center text-center mb-lg">
+      <Row className="justify-content-center text-center mb-3 mb-sm-4 mb-md-5">
         <h2>{section.sectionName}</h2>
       </Row>
       {section.members.map((row, rowIndex) => (

components/team/Subcom.jsx

@@ -1,14 +1,11 @@
 import React from "react";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 
-// import styles from "styles/modules/Subcom.module.scss"; // TODO: centre left column (col-sm-8)
-
 const Subcom = ({ portfolio }) => {
   return (
     <>
-      <div className="row">
-        {/* <div className={styles["col-sm-8"]}> */}
-        <div className="col-sm-8">
+      <div className="row d-flex align-items-center">
+        <div className="col-md-8">
           {portfolio.icons.map((icon, index) => (
             <FontAwesomeIcon
               key={`subcom-icon-${portfolio.name}-${index}`}
@@ -17,12 +14,12 @@ const Subcom = ({ portfolio }) => {
               className="m-2"
             />
           ))}
-          <div className="card-body text-center">
+          <div className="card-body text-center pb-0 pb-md-3">
             <h4 className="about-name">{portfolio.name}</h4>
             <p className="card-text subcom-desc">{portfolio.description}</p>
           </div>
         </div>
-        <div className="col-sm-4 d-flex align-items-center">
+        <div className="col-md-4">
           <div className="card-body text-center">
             <ul className="list-group">
               {portfolio.members.map((name, index) => (

data/NominationsData.js

@@ -1,22 +1,23 @@
-import Alex_Image from "public/img/nominee/Alex.JPG";
-import Amal_Image from "public/img/nominee/Amal.jpg";
-import Anna_Image from "public/img/nominee/Anna.jpg";
-import Arya_Image from "public/img/nominee/Arya.jpg";
-import Dinara_Image from "public/img/nominee/Dinara.jpg";
-import Doris_Image from "public/img/nominee/Doris.JPG";
-import Franklin_Image from "public/img/nominee/Franklin.png";
-import Imogen_Image from "public/img/nominee/Imogen.png";
-import Inika_Image from "public/img/nominee/Inika.jpg";
-import Kelly_Image from "public/img/nominee/Kelly.JPG";
-import Kiran_Image from "public/img/nominee/Kiran.jpeg";
-import Lucas_Image from "public/img/nominee/Lucas.jpg";
-import Maggie_Image from "public/img/nominee/Maggie.jpg";
-import Matthew_Image from "public/img/nominee/Matthew.jpg";
-import Nicholas_Image from "public/img/nominee/Nicholas.png";
-import Peter_Image from "public/img/nominee/Peter.png";
-import Sam_Image from "public/img/nominee/Sam.jpg";
-import Sebastian_Image from "public/img/nominee/Sebastian.png";
-import Sienna_Image from "public/img/nominee/Sienna.png";
+// TODO: For 2025 nominations, add images to "public/img/nominee/name.jpg"
+import Alex_Image from "public/img/exec/2024/Alex.jpg";
+import Amal_Image from "public/img/exec/2024/Amal.jpg";
+import Anna_Image from "public/img/exec/2024/Anna.jpg";
+import Arya_Image from "public/img/exec/2024/Arya.jpg";
+import Dinara_Image from "public/img/exec/2024/Dinara.jpg";
+import Doris_Image from "public/img/exec/2024/Doris.jpg";
+import Franklin_Image from "public/img/exec/2024/Franklin.png";
+import Imogen_Image from "public/img/exec/2024/Imogen.png";
+import Inika_Image from "public/img/exec/2024/Inika.jpg";
+import Kelly_Image from "public/img/exec/2024/Kelly.jpg";
+import Kiran_Image from "public/img/exec/2024/Kiran.jpeg";
+import Lucas_Image from "public/img/exec/2024/Lucas.jpg";
+import Maggie_Image from "public/img/exec/2024/Maggie.jpg";
+import Matthew_Image from "public/img/exec/2024/Matthew.jpg";
+import Nicholas_Image from "public/img/exec/2024/Nicholas.png";
+import Peter_Image from "public/img/exec/2024/Peter.png";
+import Sam_Image from "public/img/exec/2024/Sam.jpg";
+import Sebastian_Image from "public/img/exec/2024/Sebastian.png";
+import Sienna_Image from "public/img/exec/2024/Sienna.png";
 
 const NOMINEES = [
   {