Tweak launch kit + add icons

4 files changed, 38 insertions, 8 deletions

diff --git a/packages/website/ts/@next/components/definition.tsx b/packages/website/ts/@next/components/definition.tsx
index 294c194a5..f7998b841 100644
--- a/packages/website/ts/@next/components/definition.tsx
+++ b/packages/website/ts/@next/components/definition.tsx
@@ -41,9 +41,15 @@ export const Definition = (props: Props) => (
                 {props.title}
             </Heading>
 
-            <Paragraph isMuted={true}>
-                {props.description}
-            </Paragraph>
+            {typeof props.description === 'string' ? (
+                <Paragraph isMuted={true}>
+                    {props.description}
+                </Paragraph>
+            ) : (
+                <>
+                    {props.description}
+                </>
+            )}
 
             {props.actions &&
                 <LinkWrap>
@@ -92,6 +98,17 @@ const TextWrap = styled.div<Props>`
     width: 100%;
     max-width: 560px;
 
+    ul {
+        padding-left: 1rem;
+    }
+
+    li {
+        list-style: disc;
+        opacity: 0.75;
+        line-height: 1.444444444;
+        margin-bottom: 1rem;
+    }
+
     @media (min-width: 768px) {
         margin-left: ${props => props.isInlineIcon && '60px'};
     }
diff --git a/packages/website/ts/@next/icons/illustrations/code-repo.svg b/packages/website/ts/@next/icons/illustrations/code-repo.svg
new file mode 100644
index 000000000..43e412198
--- /dev/null
+++ b/packages/website/ts/@next/icons/illustrations/code-repo.svg
@@ -0,0 +1,7 @@
+<svg width="82" height="82" viewBox="0 0 82 82" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M40.9185 1.43051e-06L40.9197 0C41.1377 7.15256e-07 41.3462 0.00719154 41.5359 0.0137337L41.5428 0.0139726C41.7392 0.0207458 41.9163 0.0267566 42.097 0.0267566C42.1057 0.0267566 42.1143 0.0268694 42.123 0.027095C64.2563 0.603056 82 18.7315 82 41C82 63.6526 63.6526 82 41 82C18.3474 82 0 63.6526 0 41C0 18.3752 18.3193 0.0274277 40.9185 1.43051e-06ZM40.9203 2C19.4262 2.02641 2 19.4778 2 41C2 62.548 19.452 80 41 80C62.548 80 80 62.548 80 41C80 19.8212 63.1283 2.58105 42.0835 2.02675C41.8704 2.02646 41.6666 2.01943 41.4808 2.01302L41.4739 2.01278C41.2777 2.00602 41.1008 2.00001 40.9203 2Z" fill="#00AE99"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M10.7026 14.378C10.7026 13.8257 11.1504 13.378 11.7026 13.378H33.7762C34.3284 13.378 34.7762 13.8257 34.7762 14.378V36.4516C34.7762 37.0039 34.3284 37.4516 33.7762 37.4516H11.7026C11.1504 37.4516 10.7026 37.0039 10.7026 36.4516V14.378ZM12.7026 15.378V35.4516H32.7762V15.378H12.7026Z" fill="#00AE99"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M38.6621 20.6785L33.0687 15.0851L34.4829 13.6709L40.3692 19.5572C40.5567 19.7447 40.6621 19.9991 40.6621 20.2643V42.3379C40.6621 42.8902 40.2143 43.3379 39.6621 43.3379H17.5885C17.3233 43.3379 17.0689 43.2325 16.8814 43.045L10.9951 37.1587L12.4093 35.7445L18.0027 41.3379H38.6621V20.6785Z" fill="#00AE99"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M38.6621 42.338C38.6621 41.7857 39.1098 41.338 39.6621 41.338H61.7357C62.288 41.338 62.7357 41.7857 62.7357 42.338V64.4116C62.7357 64.9638 62.288 65.4116 61.7357 65.4116H39.6621C39.1098 65.4116 38.6621 64.9638 38.6621 64.4116V42.338ZM40.6621 43.338V63.4116H60.7357V43.338H40.6621Z" fill="#00AE99"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M66.622 48.6385L61.0286 43.0451L62.4429 41.6309L68.3291 47.5172C68.5167 47.7047 68.622 47.9591 68.622 48.2243V70.2979C68.622 70.8501 68.1743 71.2979 67.622 71.2979H45.5485C45.2833 71.2979 45.0289 71.1925 44.8414 71.005L38.9551 65.1187L40.3693 63.7045L45.9627 69.2979H66.622V48.6385Z" fill="#00AE99"/>
+</svg>
diff --git a/packages/website/ts/@next/icons/illustrations/eth-based-tokens.svg b/packages/website/ts/@next/icons/illustrations/eth-based-tokens.svg
new file mode 100644
index 000000000..b0370d234
--- /dev/null
+++ b/packages/website/ts/@next/icons/illustrations/eth-based-tokens.svg
@@ -0,0 +1,6 @@
+<svg width="84" height="84" viewBox="0 0 84 84" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M42.1187 1.19995L42.1199 1.19995C42.3379 1.19995 42.5464 1.20714 42.7361 1.21368L42.743 1.21392C42.9394 1.2207 43.1165 1.22671 43.2972 1.22671C43.3058 1.22671 43.3145 1.22682 43.3232 1.22705C65.4565 1.80301 83.2002 19.9314 83.2002 42.1999C83.2002 64.8526 64.8528 83.1999 42.2002 83.1999C19.5476 83.1999 1.2002 64.8526 1.2002 42.1999C1.2002 19.5752 19.5195 1.22738 42.1187 1.19995ZM42.1205 3.19995C20.6264 3.22636 3.2002 20.6778 3.2002 42.1999C3.2002 63.748 20.6521 81.1999 42.2002 81.1999C63.7482 81.1999 81.2002 63.748 81.2002 42.1999C81.2002 21.0212 64.3285 3.781 43.2837 3.2267C43.0706 3.22641 42.8668 3.21938 42.681 3.21297L42.6741 3.21274C42.4779 3.20597 42.301 3.19997 42.1205 3.19995Z" fill="#00AE99"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M68.0979 42.2001C68.0979 42.5434 67.9218 42.8627 67.6314 43.0459L42.7337 58.7489C42.4077 58.9544 41.9927 58.9544 41.6667 58.7489L16.769 43.0459C16.4786 42.8628 16.3025 42.5434 16.3025 42.2001C16.3025 41.8567 16.4786 41.5374 16.769 41.3543L41.6667 25.6513C41.9927 25.4457 42.4077 25.4457 42.7337 25.6513L67.6314 41.3543C67.9218 41.5374 68.0979 41.8567 68.0979 42.2001ZM42.2002 27.6794L19.177 42.2001L42.2002 56.7208L65.2234 42.2001L42.2002 27.6794Z" fill="#00AE99"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M66.1803 49.8738C66.5224 50.2245 66.5601 50.7714 66.2693 51.1656L43.005 82.7131C42.8165 82.9687 42.5178 83.1196 42.2002 83.1196C41.8826 83.1196 41.5838 82.9687 41.3953 82.7131L18.1311 51.1656C17.8403 50.7714 17.878 50.2245 18.2201 49.8739C18.5621 49.5232 19.1079 49.4719 19.5092 49.7528L42.2002 65.6307L64.8912 49.7528C65.2925 49.4719 65.8383 49.5232 66.1803 49.8738ZM61.0375 54.8904L42.7735 67.6705C42.4292 67.9114 41.9711 67.9114 41.6268 67.6705L23.3628 54.8904L42.2002 80.4347L61.0375 54.8904Z" fill="#00AE99"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M42.2002 1.28039C42.5439 1.28039 42.8635 1.45687 43.0465 1.74773L68.1713 41.6673L66.4786 42.7326L42.2002 4.15775L17.9218 42.7327L16.2291 41.6673L41.3539 1.74773C41.5369 1.45687 41.8565 1.28039 42.2002 1.28039Z" fill="#00AE99"/>
+</svg>
diff --git a/packages/website/ts/@next/pages/launch_kit.tsx b/packages/website/ts/@next/pages/launch_kit.tsx
index c3447f12f..15710bed9 100644
--- a/packages/website/ts/@next/pages/launch_kit.tsx
+++ b/packages/website/ts/@next/pages/launch_kit.tsx
@@ -58,7 +58,7 @@ export class NextLaunchKit extends React.PureComponent {
                         titleSize="small"
                         description="Tap into and share liquidity with other relayers"
                         icon="supportForAllEthereumStandards"
-                        iconSize="large"
+                        iconSize="medium"
                         isInline={true}
                     />
 
@@ -66,8 +66,8 @@ export class NextLaunchKit extends React.PureComponent {
                         title="Extensible Code Repo"
                         titleSize="small"
                         description="Fork and extend to support modes of exchange"
-                        icon="networkedLiquidity"
-                        iconSize="large"
+                        icon="code-repo"
+                        iconSize="medium"
                         isInline={true}
                     />
 
@@ -75,8 +75,8 @@ export class NextLaunchKit extends React.PureComponent {
                         title="Exchange Ethereum based Tokens"
                         titleSize="small"
                         description="Enable trading for any ERC-20 or ERC-721 asset"
-                        icon="flexibleIntegration"
-                        iconSize="large"
+                        icon="eth-based-tokens"
+                        iconSize="medium"
                         isInline={true}
                     />
                 </Section>