From 5bd185e8319f654d1691b021d38c934983a1f107 Mon Sep 17 00:00:00 2001
From: Ezekiel Aquino <ezekiel@bakkenbaeck.no>
Date: Thu, 13 Dec 2018 10:54:18 +0100
Subject: Adds images in instant page

---
 packages/website/ts/@next/pages/about/team.tsx | 24 ++++++++++++++++++------
 1 file changed, 18 insertions(+), 6 deletions(-)

(limited to 'packages/website/ts/@next/pages/about')

diff --git a/packages/website/ts/@next/pages/about/team.tsx b/packages/website/ts/@next/pages/about/team.tsx
index fe4723205..5a73d1f89 100644
--- a/packages/website/ts/@next/pages/about/team.tsx
+++ b/packages/website/ts/@next/pages/about/team.tsx
@@ -195,11 +195,11 @@ export const NextAboutTeam = () => (
                 width="70%"
                 maxWidth="800px"
             >
-                <WrapGrid isWrapped={true} isCentered={false}>
+                <StyledGrid isWrapped={true} isCentered={false}>
                     {_.map(team, (info: TeamMember, index) => (
                         <Member key={`team-${index}`} name={info.name} title={info.title} imageUrl={info.imageUrl} />
                     ))}
-                </Wrap>
+                </StyledGrid>
             </Column>
         </Section>
 
@@ -213,17 +213,27 @@ export const NextAboutTeam = () => (
                 <Heading size="medium">Advisors</Heading>
             </Column>
 
-            <Column>
-                <WrapGrid isWrapped={true} isCentered={false}>
+            <Column
+                width="70%"
+                maxWidth="800px"
+            >
+                <StyledGrid isWrapped={true} isCentered={false}>
                     {_.map(advisors, (info: TeamMember, index) => (
                         <Member key={`advisor-${index}`} name={info.name} title={info.title} imageUrl={info.imageUrl} />
                     ))}
-                </WrapGrid>
+                </StyledGrid>
             </Column>
         </Section>
     </AboutPageLayout>
 );
 
+const StyledGrid = styled.div`
+    &:after {
+        content: '';
+        clear: both;
+    }
+`;
+
 const Member = ({ name, title, imageUrl }: TeamMember) => (
     <StyledMember>
         <img src={imageUrl} alt={name}/>
@@ -233,8 +243,10 @@ const Member = ({ name, title, imageUrl }: TeamMember) => (
 );
 
 const StyledMember = styled.div`
-    width: calc(25% - 10px);
+    width: calc(25% - 15px);
     margin-bottom: 10px;
+    float: left;
+    margin-right: 10px;
 
     img, svg {
         width: 100%;
-- 
cgit