chore: scenario info fix and contributors change

harbassan · harbassan · commit bb82db2c6aff · 2025-10-19T20:53:03.000+13:00
diff --git a/frontend/src/components/FabMenu.jsx b/frontend/src/components/FabMenu.jsx
@@ -28,68 +28,43 @@ const FabMenu = () => {
     >
       <div className="flex flex-col items-end gap-4">
         <button
-          className={`shadow-lg flex items-center justify-center transition-all duration-300 mb-2 ${open ? "opacity-100" : "opacity-0 pointer-events-none"} w-[2.2rem] h-[2.2rem] rounded-[2px] rotate-45 cursor-pointer`}
+          className={`shadow-lg flex items-center justify-center transition-all duration-300 mb-2 ${open ? "opacity-100" : "opacity-0 pointer-events-none"} w-[2.2rem] h-[2.2rem] rounded-[2px] rotate-45 cursor-pointer bg-base-100 border-[2px] border-primary`}
           style={{
-            background: "var(--color-base-100)",
-            border: "2px solid var(--color-primary)",
             boxShadow: "var(--color-base-content-box-shadow)",
           }}
           onClick={handleThemeToggle}
           aria-label="Toggle Theme"
         >
           <span className="flex items-center justify-center">
-            <LightMode
-              className="text-[1.2rem]"
-              style={{ color: "var(--color-base-primary)" }}
-            />
+            <LightMode className="text-[1.2rem] text-base-primary" />
           </span>
         </button>
         <button
-          className={`shadow-lg flex items-center justify-center transition-all duration-300 mb-2 ${open ? "opacity-100" : "opacity-0 pointer-events-none"} w-[2.2rem] h-[2.2rem] rounded-[2px] rotate-45 cursor-pointer`}
+          className={`shadow-lg flex items-center justify-center transition-all duration-300 mb-2 ${open ? "opacity-100" : "opacity-0 pointer-events-none"} w-[2.2rem] h-[2.2rem] rounded-[2px] rotate-45 cursor-pointer bg-secondary border-[2px] border-secondary`}
           style={{
-            background: "var(--color-secondary)",
-            border: "2px solid var(--color-secondary)",
             boxShadow: "var(--color-base-content-box-shadow)",
           }}
           onClick={() => history.push("/aboutus")}
           aria-label="About Us"
         >
-          <span
-            className="flex items-center justify-center"
-            style={{ transform: "rotate(-45deg)" }}
-          >
-            <EmojiPeopleIcon
-              className="text-[1.2rem]"
-              style={{ color: "var(--color-base-100)" }}
-            />
+          <span className="flex items-center justify-center -rotate-45">
+            <EmojiPeopleIcon className="text-[1.2rem] text-base-100" />
           </span>
         </button>
         <button
-          className={`shadow-lg flex items-center justify-center transition-all duration-300 w-[2.2rem] h-[2.2rem] rounded-[2px] rotate-45 cursor-pointer`}
+          className="shadow-lg flex items-center justify-center transition-all duration-300 w-[2.2rem] h-[2.2rem] rounded-[2px] rotate-45 cursor-pointer border-[2px] border-primary"
           style={{
             background: open
               ? "var(--color-secondary)"
               : "var(--color-base-100)",
-            border: "2px solid var(--color-primary)",
             boxShadow: "var(--color-base-content-box-shadow)",
           }}
           aria-label="Open Menu"
         >
-          <span
-            className="flex items-center justify-center"
-            style={{ transform: "rotate(-45deg)" }}
-          >
-            {open ? (
-              <MoreVertIcon
-                className="text-[1.2rem]"
-                style={{ color: "var(--color-base-100)" }}
-              />
-            ) : (
-              <MoreVertIcon
-                className="text-[1.2rem]"
-                style={{ color: "var(--color-secondary)" }}
-              />
-            )}
+          <span className="flex items-center justify-center -rotate-45">
+            <MoreVertIcon
+              className={`text-[1.2rem] ${open ? "text-base-100" : "text-secondary"}`}
+            />
           </span>
         </button>
       </div>
diff --git a/frontend/src/features/aboutUs/AboutUsPage.jsx b/frontend/src/features/aboutUs/AboutUsPage.jsx
@@ -7,29 +7,25 @@ const AboutUsPage = () => {
   const history = useHistory();
   const location = useLocation();
 
+  function goBack() {
+    if (location.key !== undefined) {
+      history.goBack();
+    } else {
+      history.push("/");
+    }
+  }
+
   return (
-    <div
-      className="flex h-screen w-screen relative bg-[var(--color-base-100)]"
-      style={{ fontFamily: "DMSans, sans-serif", fontWeight: 400 }}
-    >
+    <div className="flex h-screen w-screen relative bg-base-100 font-dm font-normal">
       <button
         className="absolute top-8 left-8 bg-transparent border-none p-2 cursor-pointer z-10"
-        onClick={() => {
-          if (location.key !== undefined) {
-            history.goBack();
-          } else {
-            history.push("/");
-          }
-        }}
+        onClick={goBack}
         aria-label="Close"
       >
-        <CloseIcon className="!w-8 !h-8 text-[var(--color-base-content)]" />
+        <CloseIcon className="!w-8 !h-8 text-base-content" />
       </button>
-      <div className="w-1/2 flex flex-col justify-center items-center bg-[var(--color-base-100)]">
-        <div
-          className="flex flex-col items-start leading-tight text-[var(--color-base-content)] font-normal text-[5vw] mb-[10vh]"
-          style={{ fontFamily: "DMSans, sans-serif" }}
-        >
+      <div className="w-1/2 flex flex-col justify-center items-center bg-base-100">
+        <div className="flex flex-col items-start leading-tight text-base-content font-normal text-[5vw] mb-[10vh]">
           <span>Virtual</span>
           <span>Patient</span>
           <span>Simulator</span>
@@ -41,10 +37,7 @@ const AboutUsPage = () => {
             key={group.year}
             className={`mb-12 ${idx === 0 ? "mt-[16vh]" : ""} ${idx === contributorsByYear.length - 1 ? "pb-[15vh]" : ""}`}
           >
-            <div
-              className="text-2xl mb-4 text-[var(--color-base-content)] font-normal"
-              style={{ fontFamily: "IBMPlexSans, sans-serif" }}
-            >
+            <div className="text-2xl mb-4 text-base-content font-normal font-ibm">
               {group.year}
             </div>
             <div className="grid grid-cols-1 gap-2">
@@ -53,19 +46,10 @@ const AboutUsPage = () => {
                   key={contributor.login}
                   className="flex flex-row items-center justify-center"
                 >
-                  <span
-                    className="text-sm text-right text-[var(--color-primary)] font-normal mr-6 min-w-[240px]"
-                    style={{ fontFamily: "IBMPlexSans, sans-serif" }}
-                  >
+                  <span className="text-sm text-right font-ibm text-primary font-normal mr-6 min-w-[240px]">
                     {getContributionText(contributor.contributions)}
                   </span>
-                  <span
-                    className="text-m text-left text-[var(--color-base-content)] font-bold"
-                    style={{
-                      fontFamily: "IBMPlexSans, sans-serif",
-                      minWidth: 220,
-                    }}
-                  >
+                  <span className="text-m text-left text-base-content font-bold font-ibm min-w-[220px]">
                     {contributor.name}
                   </span>
                 </div>
@@ -83,6 +67,13 @@ const AboutUsPage = () => {
 function getContributionText(contributions) {
   if (!contributions || !Array.isArray(contributions)) return "";
 
+  if (
+    contributions.includes("code") &&
+    contributions.includes("projectManagement")
+  ) {
+    return "Technical Lead";
+  }
+
   return contributions
     .map((contribution) => {
       switch (contribution) {
@@ -91,7 +82,7 @@ function getContributionText(contributions) {
         case "projectManagement":
           return "Project Manager";
         case "design":
-          return "Designer";
+          return "Design Lead";
         case "infra":
           return "Infrastructure";
         default:
diff --git a/frontend/src/features/aboutUs/contributorsByYear.js b/frontend/src/features/aboutUs/contributorsByYear.js
@@ -21,25 +21,25 @@ const contributorsByYear = [
         name: "Hazik Chaudhry",
         avatar_url: "https://avatars.githubusercontent.com/u/99319319?v=4",
         profile: "https://github.com/hazikchaudhry",
-        contributions: ["code", "design"],
+        contributions: ["code"],
       },
       {
         login: "mshi672",
-        name: "mshi672",
+        name: "Mike Shi",
         avatar_url: "https://avatars.githubusercontent.com/u/162376891?v=4",
         profile: "https://github.com/mshi672",
         contributions: ["code", "design"],
       },
       {
         login: "IceBear-2000",
-        name: "IceBear-2000",
+        name: "Moksh Manglani",
         avatar_url: "https://avatars.githubusercontent.com/u/160542881?v=4",
         profile: "https://github.com/IceBear-2000",
-        contributions: ["code", "design"],
+        contributions: ["code"],
       },
       {
         login: "kelvinchen8",
-        name: "kelvinchen8",
+        name: "Kelvin Chen",
         avatar_url: "https://avatars.githubusercontent.com/u/161402193?v=4",
         profile: "https://github.com/kelvinchen8",
         contributions: ["code"],
@@ -53,7 +53,7 @@ const contributorsByYear = [
       },
       {
         login: "Richman-Tan",
-        name: "rtan654",
+        name: "Richman Tan",
         avatar_url: "https://avatars.githubusercontent.com/u/160602954?v=4",
         profile: "https://github.com/Richman-Tan",
         contributions: ["code"],
@@ -74,7 +74,7 @@ const contributorsByYear = [
       },
       {
         login: "Brad123ghost",
-        name: "Bradley",
+        name: "Bradley Chung",
         avatar_url: "https://avatars.githubusercontent.com/u/32890981?v=4",
         profile: "https://github.com/Brad123ghost",
         contributions: ["code"],
@@ -93,7 +93,7 @@ const contributorsByYear = [
       },
       {
         login: "JordanBlenn",
-        name: "Jordan",
+        name: "Jordan Blenn",
         avatar_url: "https://avatars.githubusercontent.com/u/127293604?v=4",
         profile: "https://github.com/JordanBlenn",
         contributions: ["projectManagement"],
@@ -107,21 +107,21 @@ const contributorsByYear = [
       },
       {
         login: "itsatulbox",
-        name: "itsatulbox",
+        name: "Atul Kodla",
         avatar_url: "https://avatars.githubusercontent.com/u/161205868?v=4",
         profile: "https://github.com/itsatulbox",
         contributions: ["code"],
       },
       {
         login: "laibatool792",
-        name: "laibatool792",
+        name: "Laiba Batool",
         avatar_url: "https://avatars.githubusercontent.com/u/133545972?v=4",
         profile: "https://github.com/laibatool792",
         contributions: ["code"],
       },
       {
         login: "sbeen56",
-        name: "sbeen56",
+        name: "Subeen",
         avatar_url: "https://avatars.githubusercontent.com/u/161543207?v=4",
         profile: "https://github.com/sbeen56",
         contributions: ["code"],
@@ -142,7 +142,14 @@ const contributorsByYear = [
       },
       {
         login: "jacobmathew105",
-        name: "jacobmathew105",
+        name: "Jacob Mathew",
+        avatar_url: "https://avatars.githubusercontent.com/u/136278107?v=4",
+        profile: "https://github.com/jacobmathew105",
+        contributions: ["code"],
+      },
+      {
+        login: "jacobmathew105",
+        name: "Koutaro Yumiba",
         avatar_url: "https://avatars.githubusercontent.com/u/136278107?v=4",
         profile: "https://github.com/jacobmathew105",
         contributions: ["code"],
diff --git a/frontend/src/features/scenarioInfo/ScenarioInfo.jsx b/frontend/src/features/scenarioInfo/ScenarioInfo.jsx
@@ -118,10 +118,7 @@ function ScenarioInfo() {
   };
 
   return (
-    <div
-      className="bg-base-100 text-base-content min-h-screen relative overflow-x-hidden"
-      data-theme="vps-light"
-    >
+    <div className="bg-base-100 text-base-content min-h-screen relative overflow-x-hidden">
       {/* Back Button */}
       <button
         className="absolute z-50 bg-transparent border-none text-primary cursor-pointer hover:text-base-content transition-colors px-8 py-6 top-0 left-0 font-dm text-s"
@@ -287,10 +284,7 @@ function ScenarioInfo() {
       {/* Edit Details Modal */}
       {showEditModal && (
         <dialog open className="modal modal-open fixed inset-0 z-[9999]">
-          <div
-            className="modal-box bg-base-100 border border-primary/20 w-[600px] max-w-[90vw] p-8"
-            data-theme="vps-dark"
-          >
+          <div className="modal-box bg-base-100 border border-primary/20 w-[600px] max-w-[90vw] p-8">
             <h3 className="font-bold text-2xl mb-6 text-base-content font-dm">
               Edit Scenario Details
             </h3>
