From 5084269774f2f68f21c20d3161645d70952bc9d7 Mon Sep 17 00:00:00 2001
From: jinhojang6 <jinho5051@gmail.com>
Date: Thu, 7 Dec 2023 21:58:53 +0900
Subject: [PATCH] chore: remove photos from team section

---
 src/components/Team/Member.tsx | 32 +++++++++++++++++++++-----------
 src/components/Team/Team.tsx   | 11 +++++++++++
 src/pages/index.mdx            | 18 ++++++++++++++----
 3 files changed, 46 insertions(+), 15 deletions(-)

diff --git a/src/components/Team/Member.tsx b/src/components/Team/Member.tsx
index e8a28de..b388fff 100644
--- a/src/components/Team/Member.tsx
+++ b/src/components/Team/Member.tsx
@@ -4,15 +4,17 @@ import Image from 'next/image'
 
 interface Props {
   children: React.ReactNode
-  img: string
+  img?: string
 }
 
-export const Member = ({ img, children }: Props) => {
+export const Member = ({ img = '', children }: Props) => {
   return (
     <Container>
-      <ImageContainer>
-        <MemberImage src={img} alt={img} fill />
-      </ImageContainer>
+      {img?.length ? (
+        <ImageContainer>
+          <MemberImage src={img} alt={img} fill />{' '}
+        </ImageContainer>
+      ) : null}
       <Content>{children}</Content>
     </Container>
   )
@@ -22,17 +24,15 @@ const Container = styled.div`
   display: flex;
   flex-direction: column;
   align-items: center;
+  padding-top: 24px;
+  padding-bottom: 8px;
+  border-top: 1px solid rgba(0, 0, 0, 0.18);
 
   h3 {
     text-overflow: ellipsis;
     font-size: 22px;
     font-weight: 400;
     line-height: 130%;
-
-    @media (max-width: ${breakpoints.xl}px) {
-      font-size: 16px;
-      line-height: 20px;
-    }
   }
 
   p {
@@ -41,8 +41,18 @@ const Container = styled.div`
     font-weight: 400;
     text-transform: capitalize;
     opacity: 0.5;
+  }
 
-    @media (max-width: ${breakpoints.xl}px) {
+  @media (max-width: ${breakpoints.xl}px) {
+    padding-top: 16px;
+    padding-bottom: 8px;
+
+    h3 {
+      font-size: 16px;
+      line-height: 20px;
+    }
+
+    p {
       font-size: 13px;
       line-height: 18px;
     }
diff --git a/src/components/Team/Team.tsx b/src/components/Team/Team.tsx
index 408d6d5..99e7748 100644
--- a/src/components/Team/Team.tsx
+++ b/src/components/Team/Team.tsx
@@ -31,6 +31,13 @@ const Title = styled.p`
     line-height: 20px;
     padding-block: 18px;
   }
+
+  @media (max-width: ${breakpoints.md}px) {
+    font-size: 22px;
+    line-height: 122%;
+    padding-block: 16px;
+    margin-bottom: 24px;
+  }
 `
 
 const Grid = styled.div`
@@ -41,6 +48,10 @@ const Grid = styled.div`
   @media (max-width: ${breakpoints.xl}px) {
     gap: 12px;
   }
+
+  @media (max-width: ${breakpoints.md}px) {
+    gap: 8px;
+  }
 `
 
 export default Team
diff --git a/src/pages/index.mdx b/src/pages/index.mdx
index e216420..54d71d1 100644
--- a/src/pages/index.mdx
+++ b/src/pages/index.mdx
@@ -137,22 +137,32 @@ import BU_DATA from '../data/bu-data'
 
     </Mission>
     <Team>
-        <Member img="/photos/agata-ferreira.jpeg">
+        <Member>
+            ### Jarrad Hope
+
+            Co-founder
+        </Member>
+        <Member>
+            ### Carl Bennetts
+
+            Co-founder
+        </Member>
+        <Member>
             ### Dr. Agata Ferreira
 
             Chief Legal Officer
         </Member>
-        <Member img="/photos/jonathan-barker.jpeg">
+        <Member>
             ### Jonathan Barker
 
             Head of People Operations
         </Member>
-         <Member img="/photos/matthew-nemer.png">
+         <Member>
             ### Matthew Nemer
 
             Head of Investor Relations
         </Member>
-        <Member img="/photos/ned-karlovich.jpeg">
+        <Member>
             ### Ned Karlovich
 
             Creative Director