Whitespace on instant image thing, other changes

packages/website/ts/@next/components/heroImage.tsx

@@ -4,7 +4,7 @@ import styled from 'styled-components';
 import LogoOutlined from 'ts/@next/icons/illustrations/logo-outlined.svg';
 
 interface Props {
-    image: React.ReactNode;
+    image: React.Node;
 }
 
 export const LandingAnimation = (props: Props) => (
@@ -14,7 +14,6 @@ export const LandingAnimation = (props: Props) => (
 );
 
 const Wrap = styled.figure`
-    border: 1px solid red;
     display: inline-block;
 
     svg {

packages/website/ts/@next/components/sections/landing/hero.tsx

@@ -4,13 +4,13 @@ import {Button} from 'ts/@next/components/button';
 import {Hero} from 'ts/@next/components/hero';
 import {LandingAnimation} from 'ts/@next/components/heroImage';
 
-import LogoOutlined from 'ts/@next/icons/illustrations/logo-outlined.svg';
+import {HeroAnimation} from 'ts/@next/components/heroAnimation';
 
 export const SectionLandingHero = () => (
     <Hero
         title="Powering Decentralized Exchange"
         description="0x is the best solution for adding exchange functionality to your business."
-        figure={<LandingAnimation image={<LogoOutlined />} />}
+        figure={<LandingAnimation image={<HeroAnimation />} />}
         actions={<HeroActions />}
     />
 );

packages/website/ts/@next/pages/about/team.tsx

@@ -185,6 +185,7 @@ export const NextAboutTeam = () => (
         <Section
             maxWidth="1170px"
             isFlex={true}
+            flexBreakpoint="900px"
         >
             <Column>
                 <Heading size="medium">0x Team</Heading>
@@ -205,13 +206,14 @@ export const NextAboutTeam = () => (
         <Section
             bgColor="#F3F6F4"
             maxWidth="1170px"
+            flexBreakpoint="900px"
             isFlex={true}
         >
             <Column>
                 <Heading size="medium">Advisors</Heading>
             </Column>
 
-            <Column width="70%" maxWidth="800px">
+            <Column>
                 <WrapGrid isWrapped={true} isCentered={false}>
                     {_.map(advisors, (info: TeamMember, index) => (
                         <Member key={`advisor-${index}`} name={info.name} title={info.title} imageUrl={info.imageUrl} />

packages/website/ts/@next/pages/instant.tsx

@@ -68,7 +68,7 @@ export const Next0xInstant = () => (
             actions={<Button href="#">Get Started</Button>}
         />
 
-        <Section isFullWidth={true}>
+        <Section isFullWidth={true} isPadded={false}>
           <MarqueeWrap>
               <div>
                   <img src="/images/@next/0x-instant/0x-instant-widgets@2x.png" alt="Preview of payment widgets"/>