diff options
Diffstat (limited to 'packages/website')
| -rw-r--r-- | packages/website/ts/@next/components/definition.tsx | 18 | ||||
| -rw-r--r-- | packages/website/ts/@next/pages/launch_kit.tsx | 6 | ||||
| -rw-r--r-- | packages/website/ts/@next/pages/why.tsx | 5 |
3 files changed, 19 insertions, 10 deletions
diff --git a/packages/website/ts/@next/components/definition.tsx b/packages/website/ts/@next/components/definition.tsx index 4155db472..294c194a5 100644 --- a/packages/website/ts/@next/components/definition.tsx +++ b/packages/website/ts/@next/components/definition.tsx @@ -3,7 +3,7 @@ import styled from 'styled-components'; import { Button } from 'ts/@next/components/button'; import { Icon } from 'ts/@next/components/icon'; -import { Paragraph } from 'ts/@next/components/text'; +import { Paragraph, Heading } from 'ts/@next/components/text'; interface Action { label: string; @@ -18,6 +18,7 @@ interface Props { icon: string; iconSize?: 'medium' | 'large' | number; title: string; + titleSize?: 'small' | 'default' | number; description: React.ReactNode | string; actions?: Action[]; } @@ -31,9 +32,14 @@ export const Definition = (props: Props) => ( /> <TextWrap {...props}> - <Title> + <Heading + asElement="h2" + fontWeight="400" + marginBottom={props.titleSize === 'small' ? '7px' : '15px'} + size={props.titleSize || 'default'} + > {props.title} - </Title> + </Heading> <Paragraph isMuted={true}> {props.description} @@ -91,12 +97,6 @@ const TextWrap = styled.div<Props>` } `; -const Title = styled.h2` - font-size: 20px; - line-height: 1.3; - margin-bottom: 15px; -`; - const LinkWrap = styled.div` display: inline-flex; margin-top: 60px; diff --git a/packages/website/ts/@next/pages/launch_kit.tsx b/packages/website/ts/@next/pages/launch_kit.tsx index 9318d8a6a..c3447f12f 100644 --- a/packages/website/ts/@next/pages/launch_kit.tsx +++ b/packages/website/ts/@next/pages/launch_kit.tsx @@ -55,6 +55,7 @@ export class NextLaunchKit extends React.PureComponent { > <Definition title="Networked Liquidity Pool" + titleSize="small" description="Tap into and share liquidity with other relayers" icon="supportForAllEthereumStandards" iconSize="large" @@ -63,6 +64,7 @@ export class NextLaunchKit extends React.PureComponent { <Definition title="Extensible Code Repo" + titleSize="small" description="Fork and extend to support modes of exchange" icon="networkedLiquidity" iconSize="large" @@ -71,6 +73,7 @@ export class NextLaunchKit extends React.PureComponent { <Definition title="Exchange Ethereum based Tokens" + titleSize="small" description="Enable trading for any ERC-20 or ERC-721 asset" icon="flexibleIntegration" iconSize="large" @@ -85,7 +88,8 @@ export class NextLaunchKit extends React.PureComponent { icon={item.icon} title={item.title} description={item.description} - isWithMargin={true} + isInlineIcon={true} + iconSize={240} /> ))} </Section> diff --git a/packages/website/ts/@next/pages/why.tsx b/packages/website/ts/@next/pages/why.tsx index 6010b9c8a..b54a682ff 100644 --- a/packages/website/ts/@next/pages/why.tsx +++ b/packages/website/ts/@next/pages/why.tsx @@ -101,6 +101,7 @@ export class NextWhy extends React.PureComponent { > <Definition title="Support for all Ethereum Standards" + titleSize="small" description="0x Protocol facilitates the decentralized exchange of a growing number of Ethereum-based tokens, including all ERC-20 and ERC-721 assets. Additional ERC standards can be added to the protocol..." icon="supportForAllEthereumStandards" iconSize="large" @@ -109,6 +110,7 @@ export class NextWhy extends React.PureComponent { <Definition title="Shared Networked Liquidity" + titleSize="small" description="0x is building a layer of networked liquidity that will lower the barriers to entry. By enabling businesses to tap into a shared pool of digital assets, it will create a more stable financial system." icon="networkedLiquidity" iconSize="large" @@ -117,6 +119,7 @@ export class NextWhy extends React.PureComponent { <Definition title="Support for all Ethereum Standards" + titleSize="small" description="Relayers are businesses around the world that utilize 0x to integrate exchange functionality into a wide variety of products including order books, games, and digital art marketplaces." icon="flexibleIntegration" iconSize="large" @@ -143,6 +146,7 @@ export class NextWhy extends React.PureComponent { key={`offers-${index}`} icon={item.icon} title={item.title} + titleSize="small" description={item.description} isWithMargin={true} /> @@ -171,6 +175,7 @@ export class NextWhy extends React.PureComponent { key={`functionality-${index}`} icon={item.icon} title={item.title} + titleSize="small" description={item.description} isWithMargin={true} /> |