diff options
| -rw-r--r-- | packages/website/translations/english.json | 1 | ||||
| -rw-r--r-- | packages/website/ts/pages/landing/landing.tsx | 25 | ||||
| -rw-r--r-- | packages/website/ts/types.ts | 1 |
3 files changed, 13 insertions, 14 deletions
diff --git a/packages/website/translations/english.json b/packages/website/translations/english.json index 042af251d..6864462c5 100644 --- a/packages/website/translations/english.json +++ b/packages/website/translations/english.json @@ -19,6 +19,7 @@ "in 0x protocol, orders are transported off-chain, massively reducing gas costs and eliminating blockchain bloat. Relayers help broadcast orders and collect a fee each time they facilitate a trade. Anyone can build a relayer.", "RELAYERS_HEADER": "relayers building on 0x", "BENEFITS_HEADER": "benefits of 0x", + "USE_CASES_HEADER": "uses of 0x", "BENEFIT_ONE_TITLE": "many assets", "BENEFIT_ONE_DESCRIPTION": "the 0x protocol facilitates the exchange of a growing number of Ethereum-based tokens including currencies, game items, and many more digital assets.", diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index bd861670a..b32526bba 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -42,6 +42,12 @@ interface Project { const THROTTLE_TIMEOUT = 100; const WHATS_NEW_TITLE = 'V2 of the 0x Protocol is now live!'; const WHATS_NEW_URL = 'https://blog.0xproject.com/18-ideas-for-0x-relayers-in-2018-80a1498b955f'; +const TITLE_STYLE: React.CSSProperties = { + fontFamily: 'Roboto Mono', + color: colors.grey, + fontWeight: 300, + letterSpacing: 3, +}; const relayerProjects: Project[] = [ { @@ -276,16 +282,10 @@ export class Landing extends React.Component<LandingProps, LandingState> { </div> ); }); - const titleStyle: React.CSSProperties = { - fontFamily: 'Roboto Mono', - color: colors.grey, - fontWeight: 300, - letterSpacing: 3, - }; return ( <div className={`clearfix py4 ${isTitleCenter && 'center'}`} style={{ backgroundColor }}> <div className="mx-auto max-width-4 clearfix sm-px3"> - <div className="h4 pb3 lg-pl0 md-pl3 sm-pl2" style={titleStyle}> + <div className="h4 pb3 lg-pl0 md-pl3 sm-pl2" style={TITLE_STYLE}> {title} </div> <div className="clearfix">{projectList}</div> @@ -517,15 +517,9 @@ export class Landing extends React.Component<LandingProps, LandingState> { </div> ); }); - const titleStyle: React.CSSProperties = { - fontFamily: 'Roboto Mono', - color: colors.grey, - fontWeight: 300, - letterSpacing: 3, - }; return ( <div className="clearfix" style={{ backgroundColor: colors.heroGrey }}> - <div className="center pb3 pt4" style={titleStyle}> + <div className="center pb3 pt4" style={TITLE_STYLE}> {this.props.translate.get(Key.BenefitsHeader, Deco.Upper)} </div> <div className="mx-auto pb4 sm-mt2 clearfix" style={{ maxWidth: '60em' }}> @@ -665,6 +659,9 @@ export class Landing extends React.Component<LandingProps, LandingState> { }); return ( <div className="clearfix py4" style={{ backgroundColor: colors.heroGrey }}> + <div className="center h4 pb3 lg-pl0 md-pl3 sm-pl2" style={TITLE_STYLE}> + {this.props.translate.get(Key.UseCasesHeader, Deco.Upper)} + </div> <div className="mx-auto pb4 pt3 mt1 sm-mt2 clearfix" style={{ maxWidth: '67em' }}> {cases} </div> diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts index c8789c274..6ab17e261 100644 --- a/packages/website/ts/types.ts +++ b/packages/website/ts/types.ts @@ -415,6 +415,7 @@ export enum Key { OffChainOnChainDescription = 'OFFCHAIN_ONCHAIN_DESCRIPTION', RelayersHeader = 'RELAYERS_HEADER', BenefitsHeader = 'BENEFITS_HEADER', + UseCasesHeader = 'USE_CASES_HEADER', BenefitOneTitle = 'BENEFIT_ONE_TITLE', BenefitOneDescription = 'BENEFIT_ONE_DESCRIPTION', BenefitTwoTitle = 'BENEFIT_TWO_TITLE', |