Merge pull request #142 from bearhack-ucr/raidah/members

added committee members
bearhack-ucr · Apr 16, 2024 · 27be733 · 27be733
2 parents 19e7b15 + b41b5ff
commit 27be733
Show file tree

Hide file tree

Showing 2 changed files with 45 additions and 5 deletions.
diff --git a/src/components/Team.jsx b/src/components/Team.jsx
@@ -1,22 +1,42 @@
-import { members, directors } from "@/data/TeamMembers";
+import { members, directors, committee } from "@/data/TeamMembers";
 import Member from "@/components/Member";
 
 const Team = () => {
   return (
     <div className="w-full text-white flex flex-col items-center my-14">
       <div className="text-4xl lg:text-5xl font-header">Meet the Team</div>
-      <div className="text-2xl lg:text-3xl font-header my-4">Directors</div>
-      <div className="flex w-3/4 flex-wrap justify-center gap-4 sm:px-4 md:gap-8">
+      <div className="text-2xl lg:text-3xl font-header mt-8 mb-4">
+        Directors
+      </div>
+      <div className="grid grid-cols-2 lg:grid-cols-3 gap-4 md:gap-8">
         {directors.map(({ name, position, image }, index) => (
           <Member name={name} position={position} image={image} key={index} />
         ))}
       </div>
-      <div className="text-2xl lg:text-3xl font-header my-4">Leads</div>
-      <div className="flex w-3/4 flex-wrap justify-center gap-4 sm:px-4 md:gap-6 md:px-6 lg:gap-8 lg:px-8">
+      <div className="text-2xl lg:text-3xl font-header mt-8 mb-4">Leads</div>
+      <div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5 xl:grid-cols-6 gap-4 px-4 md:gap-6 md:px-6 lg:gap-8 lg:px-8">
         {members.map(({ name, position, image }, index) => (
           <Member name={name} position={position} image={image} key={index} />
         ))}
       </div>
+      <div className="text-2xl lg:text-3xl font-header mt-8 mb-4">
+        Committees
+      </div>
+      <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
+        {Object.entries(committee).map(([key, values], index) => (
+          <div
+            className="text-white font-paragraph text-center flex  flex-col items-center"
+            key={index}
+          >
+            <p className=" text-transparent bg-gradient-to-r from-bear-purple via-bear-teal to-bear-teal-100 w-fit bg-clip-text text-xl font-bold">
+              {key}
+            </p>
+            {values.map((name, index) => (
+              <p key={index}>{name}</p>
+            ))}
+          </div>
+        ))}
+      </div>
     </div>
   );
 };

diff --git a/src/data/TeamMembers.js b/src/data/TeamMembers.js
@@ -100,3 +100,23 @@ export const members = [
     image: Divyank,
   },
 ];
+
+export const committee = {
+  software: [
+    "Aheli Banerjee",
+    "Atharva Nevasekar",
+    "Danniel Kim",
+    "Eliot L Lee",
+    "Holland Pleskac",
+    "Javi Becerril",
+    "Jonathan Darius",
+    "Jonathan Trujillo",
+    "Julian Gonzalez",
+    "Kavin Phabiani",
+    "Kelly Ma",
+    "Raul Razo",
+    "Stanley Lew",
+    "Vaneesha Singh",
+  ],
+  marketing: ["Abhishta Umesh"],
+};