merged dev

bearhack-ucr · Apr 16, 2024 · b41b5ff · NovaSagittarii · Apr 16, 2024 · b41b5ff
2 parents 5af84ff + 582d65a
commit b41b5ff
Showing 1 changed file with 10 additions and 6 deletions.
diff --git a/src/components/Team.jsx b/src/components/Team.jsx
@@ -5,20 +5,24 @@ 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 my-4">Committees</div>
-      <div className="grid grid-cols-1 md:grid-cols-2">
+      <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"