From b9f7979e91790615c3f1e45c7a3d29d6369e8092 Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Tue, 28 Aug 2018 21:01:26 -0700 Subject: Replace projects section with relayers --- packages/website/ts/pages/landing/landing.tsx | 82 ++------------------------- 1 file changed, 5 insertions(+), 77 deletions(-) (limited to 'packages') diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index 78f5fc3c1..5b5bd753c 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -42,73 +42,6 @@ const THROTTLE_TIMEOUT = 100; const WHATS_NEW_TITLE = '18 ideas for 0x relayers in 2018'; const WHATS_NEW_URL = 'https://blog.0xproject.com/18-ideas-for-0x-relayers-in-2018-80a1498b955f'; -const relayersAndDappProjects: Project[] = [ - { - logoFileName: 'ercdex.png', - projectUrl: constants.PROJECT_URL_ERC_DEX, - }, - { - logoFileName: 'radar_relay.png', - projectUrl: constants.PROJECT_URL_RADAR_RELAY, - }, - { - logoFileName: 'paradex.png', - projectUrl: constants.PROJECT_URL_PARADEX, - }, - { - logoFileName: 'the_ocean.png', - projectUrl: constants.PROJECT_URL_0CEAN, - }, - { - logoFileName: 'dydx.png', - projectUrl: constants.PROJECT_URL_DYDX, - }, - { - logoFileName: 'ethfinex.png', - projectUrl: constants.PROJECT_URL_ETHFINEX, - }, - { - logoFileName: 'melonport.png', - projectUrl: constants.PROJECT_URL_MELONPORT, - }, - { - logoFileName: 'maker.png', - projectUrl: constants.PROJECT_URL_MAKER, - }, - { - logoFileName: 'dharma.png', - projectUrl: constants.PROJECT_URL_DHARMA, - }, - { - logoFileName: 'lendroid.png', - projectUrl: constants.PROJECT_URL_LENDROID, - }, - { - logoFileName: 'district0x.png', - projectUrl: constants.PROJECT_URL_DISTRICT_0X, - }, - { - logoFileName: 'aragon.png', - projectUrl: constants.PROJECT_URL_ARAGON, - }, - { - logoFileName: 'blocknet.png', - projectUrl: constants.PROJECT_URL_BLOCKNET, - }, - { - logoFileName: 'imtoken.png', - projectUrl: constants.PROJECT_URL_IMTOKEN, - }, - { - logoFileName: 'augur.png', - projectUrl: constants.PROJECT_URL_AUGUR, - }, - { - logoFileName: 'anx.png', - projectUrl: constants.PROJECT_URL_OPEN_ANX, - }, -]; - const relayerProjects: Project[] = [ { logoFileName: 'ethfinex.png', @@ -198,20 +131,15 @@ export class Landing extends React.Component { translate={this.props.translate} /> {this._renderHero()} - {this._renderProjects( - relayersAndDappProjects, - this.props.translate.get(Key.ProjectsHeader, Deco.Upper), - colors.projectsGrey, - false, - )} - {this._renderTokenizationSection()} - {this._renderProtocolSection()} {this._renderProjects( relayerProjects, this.props.translate.get(Key.RelayersHeader, Deco.Upper), - colors.heroGrey, + colors.projectsGrey, true, )} + {this._renderTokenizationSection()} + {this._renderProtocolSection()} + {this._renderInfoBoxes()} {this._renderBuildingBlocksSection()} {this._renderUseCases()} @@ -368,7 +296,7 @@ export class Landing extends React.Component { > {this.props.translate.get(Key.FullListPrompt)}{' '} -- cgit v1.2.3 From 557267477e10902e801e18733d551f13c402a6cd Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Tue, 28 Aug 2018 22:00:23 -0700 Subject: Add new header image --- .../website/public/images/landing/0x_homepage.svg | 386 +++++++++++++++++++++ packages/website/ts/pages/landing/landing.tsx | 9 +- 2 files changed, 391 insertions(+), 4 deletions(-) create mode 100644 packages/website/public/images/landing/0x_homepage.svg (limited to 'packages') diff --git a/packages/website/public/images/landing/0x_homepage.svg b/packages/website/public/images/landing/0x_homepage.svg new file mode 100644 index 000000000..061ac8939 --- /dev/null +++ b/packages/website/public/images/landing/0x_homepage.svg @@ -0,0 +1,386 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index 5b5bd753c..4833fa8f3 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -151,14 +151,15 @@ export class Landing extends React.Component { private _renderHero(): React.ReactNode { const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; const left = 'col lg-col-7 md-col-7 col-12 lg-pl4 md-pl4 sm-pl0 sm-px3 sm-center'; + const flexClassName = isSmallScreen ? 'flex items-center flex-column' : 'flex items-center'; return (
{this._renderWhatsNew()} -
-
- -
+
+ + +
Date: Tue, 28 Aug 2018 22:34:11 -0700 Subject: Update whats new --- packages/website/ts/pages/landing/landing.tsx | 32 ++++++++++++++++----------- 1 file changed, 19 insertions(+), 13 deletions(-) (limited to 'packages') diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index 4833fa8f3..1cc2ee5c0 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -8,6 +8,7 @@ import { SubscribeForm } from 'ts/components/forms/subscribe_form'; import { TopBar } from 'ts/components/top_bar/top_bar'; import { CallToAction } from 'ts/components/ui/button'; import { Container } from 'ts/components/ui/container'; +import { Text } from 'ts/components/ui/text'; import { Dispatcher } from 'ts/redux/dispatcher'; import { Deco, Key, Language, ScreenWidths, WebsitePaths } from 'ts/types'; import { constants } from 'ts/utils/constants'; @@ -39,7 +40,7 @@ interface Project { } const THROTTLE_TIMEOUT = 100; -const WHATS_NEW_TITLE = '18 ideas for 0x relayers in 2018'; +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 relayerProjects: Project[] = [ @@ -216,19 +217,24 @@ export class Landing extends React.Component { return ( -- cgit v1.2.3 From 6924a2b681b8f6d6c154499f3e5d7879524f89c1 Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Wed, 29 Aug 2018 10:38:15 -0700 Subject: Update benefits --- packages/website/translations/english.json | 10 +++++----- packages/website/ts/pages/landing/landing.tsx | 4 +--- 2 files changed, 6 insertions(+), 8 deletions(-) (limited to 'packages') diff --git a/packages/website/translations/english.json b/packages/website/translations/english.json index 541c29997..09b118bae 100644 --- a/packages/website/translations/english.json +++ b/packages/website/translations/english.json @@ -19,15 +19,15 @@ "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", - "BENEFIT_ONE_TITLE": "trustless exchange", + "BENEFIT_ONE_TITLE": "many assets", "BENEFIT_ONE_DESCRIPTION": - "built on Ethereum's distributed network with no centralized point of failure and no down time, each trade is settled atomically and without counterparty risk.", - "BENEFIT_TWO_TITLE": "shared liquidity", + "the 0x protocol facilitates the exchange of a growing number of Ethereum-based tokens including currencies, game items, and many more digital assets.", + "BENEFIT_TWO_TITLE": "networked liquidity", "BENEFIT_TWO_DESCRIPTION": "by sharing a standard API, relayers can easily aggregate liquidity pools, creating network effects around liquidity that compound as more relayers come online.", - "BENEFIT_THREE_TITLE": "open source", + "BENEFIT_THREE_TITLE": "exchange everywhere", "BENEFIT_THREE_DESCRIPTION": - "0x is open source, permissionless and free to use. Trade directly with a known counterparty for free or pay a relayer some ZRX tokens to access their liquidity pool.", + "0x allows trade functionality to fade into the background, enabling developers to focus on building while 0x handles the exchange.", "BUILDING_BLOCK_SECTION_HEADER": "a building block for dApps", "BUILDING_BLOCK_SECTION_DESCRIPTION": "0x protocol is a pluggable building block for dApps that require exchange functionality. Join the many developers that are already using 0x in their web applications and smart contracts.", diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index 1cc2ee5c0..83484409d 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -138,10 +138,8 @@ export class Landing extends React.Component { colors.projectsGrey, true, )} - {this._renderTokenizationSection()} - {this._renderProtocolSection()} - {this._renderInfoBoxes()} + {this._renderTokenizationSection()} {this._renderBuildingBlocksSection()} {this._renderUseCases()} {this._renderCallToAction()} -- cgit v1.2.3 From 3bc9b309f6ea1889d775da88a06d9ba8b3a67bc9 Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Wed, 29 Aug 2018 11:26:22 -0700 Subject: Update tokenization section --- packages/website/translations/english.json | 5 ++- packages/website/ts/pages/landing/landing.tsx | 54 ++++++--------------------- packages/website/ts/types.ts | 1 + 3 files changed, 15 insertions(+), 45 deletions(-) (limited to 'packages') diff --git a/packages/website/translations/english.json b/packages/website/translations/english.json index 09b118bae..4f3b4aaba 100644 --- a/packages/website/translations/english.json +++ b/packages/website/translations/english.json @@ -9,7 +9,7 @@ "FULL_LIST_LINK": "full list", "TOKENIZED_SECTION_HEADER": "the world's value is becoming tokenized", "TOKENIZED_SECTION_DESCRIPTION": - "the Ethereum blockchain is an open, borderless financial system that represents a wide variety of assets as cryptographic tokens. In the future, most digital assets and goods will be tokenized.", + "0x is the critical infrastructure layer in the emerging financial stack built on a foundation of Ethereum token standards. Developers needing exchange functionality for ERC 20 tokens, ERC 721 tokens, or any new asset type can easily integrate the 0x protocol into their application.", "CURRENCY": "currency", "TRADITIONAL_ASSETS": "traditional assets", "DIGITAL_GOODS": "digital goods", @@ -80,5 +80,6 @@ "DEVELOPERS": "developers", "HOME": "home", "ROCKETCHAT": "rocket.chat", - "TRADE_CALL_TO_ACTION": "trade on 0x" + "TRADE_CALL_TO_ACTION": "trade on 0x", + "OUR_MISSION_AND_VALUES": "our mission & values" } diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index 83484409d..08da4da8f 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -335,7 +335,7 @@ export class Landing extends React.Component { > {this.props.translate.get(Key.TokenizedSectionDescription, Deco.Cap)}
-
{this._renderAssetTypes()}
+
{this._renderMissionAndValuesButton()}
{!isSmallScreen && this._renderTokenCloud()} @@ -461,48 +461,16 @@ export class Landing extends React.Component {
); } - private _renderAssetTypes(): React.ReactNode { - const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; - const assetTypes: AssetType[] = [ - { - title: this.props.translate.get(Key.Currency, Deco.Cap), - imageUrl: '/images/landing/currency.png', - }, - { - title: this.props.translate.get(Key.TraditionalAssets, Deco.Cap), - imageUrl: '/images/landing/stocks.png', - style: { - paddingLeft: isSmallScreen ? 41 : 56, - paddingRight: isSmallScreen ? 41 : 56, - }, - }, - { - title: this.props.translate.get(Key.DigitalGoods, Deco.Cap), - imageUrl: '/images/landing/digital_goods.png', - }, - ]; - const assets = _.map(assetTypes, (assetType: AssetType) => { - const style = _.isUndefined(assetType.style) ? {} : assetType.style; - return ( -
-
- -
-
- {assetType.title} -
-
- ); - }); - return assets; + private _renderMissionAndValuesButton(): React.ReactNode { + return ( + + {this.props.translate.get(Key.OurMissionAndValues, Deco.CapWords)} + + ); } private _renderInfoBoxes(): React.ReactNode { const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts index c637171dd..398a8da11 100644 --- a/packages/website/ts/types.ts +++ b/packages/website/ts/types.ts @@ -468,6 +468,7 @@ export enum Key { Home = 'HOME', RocketChat = 'ROCKETCHAT', TradeCallToAction = 'TRADE_CALL_TO_ACTION', + OurMissionAndValues = 'OUR_MISSION_AND_VALUES', } export enum SmartContractDocSections { -- cgit v1.2.3 From b1c5f6e8f175aab891b735ed0b4382a787cbbd9b Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Wed, 29 Aug 2018 12:41:25 -0700 Subject: Update use cases section --- packages/website/translations/english.json | 12 ++- packages/website/ts/pages/landing/landing.tsx | 133 ++++++++++++++++---------- packages/website/ts/types.ts | 4 + 3 files changed, 98 insertions(+), 51 deletions(-) (limited to 'packages') diff --git a/packages/website/translations/english.json b/packages/website/translations/english.json index 4f3b4aaba..042af251d 100644 --- a/packages/website/translations/english.json +++ b/packages/website/translations/english.json @@ -43,10 +43,10 @@ "decentralized prediction market platforms generate sets of tokens that represent a financial stake in the outcomes of real-world events. 0x allows these tokens to be instantly tradable.", "STABLE_TOKENS": "stable tokens", "STABLE_TOKENS_DESCRIPTION": - "Novel economic constructs such as stable coins require efficient, liquid markets to succeed. 0x will facilitate the underlying economic mechanisms that allow these tokens to remain stable.", + "novel economic constructs such as stable coins require efficient, liquid markets to succeed. 0x will facilitate the underlying economic mechanisms that allow these tokens to remain stable.", "DECENTRALIZED_LOANS": "decentralized loans", "DECENTRALIZED_LOANS_DESCRIPTION": - "Efficient lending requires liquid markets where investors can buy and re-sell loans. 0x enables an ecosystem of lenders to self-organize and efficiently determine market prices for all outstanding loans.", + "efficient lending requires liquid markets where investors can buy and re-sell loans. 0x enables an ecosystem of lenders to self-organize and efficiently determine market prices for all outstanding loans.", "FUND_MANAGEMENT": "fund management", "FUND_MANAGEMENT_DESCRIPTION": "Decentralized fund management limits fund managers to investing in pre-agreed upon asset classes. Embedding 0x into fund management smart contracts enables them to enforce these security constraints.", @@ -81,5 +81,11 @@ "HOME": "home", "ROCKETCHAT": "rocket.chat", "TRADE_CALL_TO_ACTION": "trade on 0x", - "OUR_MISSION_AND_VALUES": "our mission & values" + "OUR_MISSION_AND_VALUES": "our mission & values", + "GAMING_AND_COLLECTABLES": "gaming & collectables", + "GAMING_AND_COLLECTABLES_DESCRIPTION": + "artists and game makers are tokenizing digital art and in-game items known as non-fungible tokens (NFTs). 0x enables these creators to add exchange functionality to give access and the ability to build marketplaces for NFT trading.", + "ORDER_BOOKS": "order books", + "ORDER_BOOKS_DESCRIPTION": + "there are thousands of decentralized apps that have native utility tokens. 0x provides market makers and professional exchanges an ability to host order books to facilitate the exchange of these assets." } diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index 08da4da8f..68984896e 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -32,7 +32,6 @@ interface UseCase { description: string; classNames: string; style?: React.CSSProperties; - projectIconUrls: string[]; } interface Project { logoFileName: string; @@ -140,7 +139,6 @@ export class Landing extends React.Component { )} {this._renderInfoBoxes()} {this._renderTokenizationSection()} - {this._renderBuildingBlocksSection()} {this._renderUseCases()} {this._renderCallToAction()}
@@ -535,53 +533,92 @@ export class Landing extends React.Component {
); } - private _renderUseCases(): React.ReactNode { + private _getUseCases(): UseCase[] { const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; - - const useCases: UseCase[] = [ - { - imageUrl: '/images/landing/governance_icon.png', - type: this.props.translate.get(Key.DecentralizedGovernance, Deco.Upper), - description: this.props.translate.get(Key.DecentralizedGovernanceDescription, Deco.Cap), - projectIconUrls: ['/images/landing/aragon.png'], - classNames: 'lg-px2 md-px2', - }, - { - imageUrl: '/images/landing/prediction_market_icon.png', - type: this.props.translate.get(Key.PredictionMarkets, Deco.Upper), - description: this.props.translate.get(Key.PredictionMarketsDescription, Deco.Cap), - projectIconUrls: ['/images/landing/augur.png'], - classNames: 'lg-px2 md-px2', - }, - { - imageUrl: '/images/landing/stable_tokens_icon.png', - type: this.props.translate.get(Key.StableTokens, Deco.Upper), - description: this.props.translate.get(Key.StableTokensDescription, Deco.Cap), - projectIconUrls: ['/images/landing/maker.png'], - classNames: 'lg-px2 md-px2', - }, - { - imageUrl: '/images/landing/loans_icon.png', - type: this.props.translate.get(Key.DecentralizedLoans, Deco.Upper), - description: this.props.translate.get(Key.DecentralizedLoansDescription, Deco.Cap), - projectIconUrls: ['/images/landing/dharma.png', '/images/landing/lendroid.png'], - classNames: 'lg-pr2 md-pr2 lg-col-6 md-col-6', - style: { - width: 291, - float: 'right', - marginTop: !isSmallScreen ? 38 : 0, + const isEnglish = this.props.translate.getLanguage() === Language.English; + if (isEnglish) { + return [ + { + imageUrl: '/images/landing/governance_icon.png', + type: this.props.translate.get(Key.GamingAndCollectables, Deco.Upper), + description: this.props.translate.get(Key.GamingAndCollectablesDescription, Deco.Cap), + classNames: 'lg-px2 md-px2', }, - }, - { - imageUrl: '/images/landing/fund_management_icon.png', - type: this.props.translate.get(Key.FundManagement, Deco.Upper), - description: this.props.translate.get(Key.FundManagementDescription, Deco.Cap), - projectIconUrls: ['/images/landing/melonport.png'], - classNames: 'lg-pl2 md-pl2 lg-col-6 md-col-6', - style: { width: 291, marginTop: !isSmallScreen ? 38 : 0 }, - }, - ]; - + { + imageUrl: '/images/landing/prediction_market_icon.png', + type: this.props.translate.get(Key.PredictionMarkets, Deco.Upper), + description: this.props.translate.get(Key.PredictionMarketsDescription, Deco.Cap), + classNames: 'lg-px2 md-px2', + }, + { + imageUrl: '/images/landing/fund_management_icon.png', + type: this.props.translate.get(Key.OrderBooks, Deco.Upper), + description: this.props.translate.get(Key.OrderBooksDescription, Deco.Cap), + classNames: 'lg-px2 md-px2', + }, + { + imageUrl: '/images/landing/loans_icon.png', + type: this.props.translate.get(Key.DecentralizedLoans, Deco.Upper), + description: this.props.translate.get(Key.DecentralizedLoansDescription, Deco.Cap), + classNames: 'lg-pr2 md-pr2 lg-col-6 md-col-6', + style: { + width: 291, + float: 'right', + marginTop: !isSmallScreen ? 38 : 0, + }, + }, + { + imageUrl: '/images/landing/stable_tokens_icon.png', + type: this.props.translate.get(Key.StableTokens, Deco.Upper), + description: this.props.translate.get(Key.StableTokensDescription, Deco.Cap), + classNames: 'lg-pl2 md-pl2 lg-col-6 md-col-6', + style: { width: 291, marginTop: !isSmallScreen ? 38 : 0 }, + }, + ]; + } else { + return [ + { + imageUrl: '/images/landing/governance_icon.png', + type: this.props.translate.get(Key.DecentralizedGovernance, Deco.Upper), + description: this.props.translate.get(Key.DecentralizedGovernanceDescription, Deco.Cap), + classNames: 'lg-px2 md-px2', + }, + { + imageUrl: '/images/landing/prediction_market_icon.png', + type: this.props.translate.get(Key.PredictionMarkets, Deco.Upper), + description: this.props.translate.get(Key.PredictionMarketsDescription, Deco.Cap), + classNames: 'lg-px2 md-px2', + }, + { + imageUrl: '/images/landing/stable_tokens_icon.png', + type: this.props.translate.get(Key.StableTokens, Deco.Upper), + description: this.props.translate.get(Key.StableTokensDescription, Deco.Cap), + classNames: 'lg-px2 md-px2', + }, + { + imageUrl: '/images/landing/loans_icon.png', + type: this.props.translate.get(Key.DecentralizedLoans, Deco.Upper), + description: this.props.translate.get(Key.DecentralizedLoansDescription, Deco.Cap), + classNames: 'lg-pr2 md-pr2 lg-col-6 md-col-6', + style: { + width: 291, + float: 'right', + marginTop: !isSmallScreen ? 38 : 0, + }, + }, + { + imageUrl: '/images/landing/fund_management_icon.png', + type: this.props.translate.get(Key.FundManagement, Deco.Upper), + description: this.props.translate.get(Key.FundManagementDescription, Deco.Cap), + classNames: 'lg-pl2 md-pl2 lg-col-6 md-col-6', + style: { width: 291, marginTop: !isSmallScreen ? 38 : 0 }, + }, + ]; + } + } + private _renderUseCases(): React.ReactNode { + const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; + const useCases = this._getUseCases(); const cases = _.map(useCases, (useCase: UseCase) => { const style = _.isUndefined(useCase.style) || isSmallScreen ? {} : useCase.style; const useCaseBoxStyle = { @@ -626,7 +663,7 @@ export class Landing extends React.Component { ); }); return ( -
+
{cases}
diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts index 398a8da11..c8789c274 100644 --- a/packages/website/ts/types.ts +++ b/packages/website/ts/types.ts @@ -436,6 +436,10 @@ export enum Key { DecentralizedLoansDescription = 'DECENTRALIZED_LOANS_DESCRIPTION', FundManagement = 'FUND_MANAGEMENT', FundManagementDescription = 'FUND_MANAGEMENT_DESCRIPTION', + GamingAndCollectables = 'GAMING_AND_COLLECTABLES', + GamingAndCollectablesDescription = 'GAMING_AND_COLLECTABLES_DESCRIPTION', + OrderBooks = 'ORDER_BOOKS', + OrderBooksDescription = 'ORDER_BOOKS_DESCRIPTION', FinalCallToAction = 'FINAL_CALL_TO_ACTION', Documentation = 'DOCUMENTATION', Community = 'COMMUNITY', -- cgit v1.2.3 From 5d008ee83ead8207c7aa80b249703660be8f7fad Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Thu, 30 Aug 2018 11:19:58 -0700 Subject: Update what's new styling --- packages/website/ts/pages/landing/landing.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) (limited to 'packages') diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index 68984896e..3d0e6eb62 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -215,19 +215,19 @@ export class Landing extends React.Component {
- + New - + {WHATS_NEW_TITLE} -- cgit v1.2.3 From 038c21324e2ae37f2cd6f1199ee176707cd1fed4 Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Thu, 30 Aug 2018 11:27:00 -0700 Subject: Make hero image responsive --- packages/website/ts/pages/landing/landing.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) (limited to 'packages') diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index 3d0e6eb62..bd861670a 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -8,6 +8,7 @@ import { SubscribeForm } from 'ts/components/forms/subscribe_form'; import { TopBar } from 'ts/components/top_bar/top_bar'; import { CallToAction } from 'ts/components/ui/button'; import { Container } from 'ts/components/ui/container'; +import { Image } from 'ts/components/ui/image'; import { Text } from 'ts/components/ui/text'; import { Dispatcher } from 'ts/redux/dispatcher'; import { Deco, Key, Language, ScreenWidths, WebsitePaths } from 'ts/types'; @@ -154,8 +155,8 @@ export class Landing extends React.Component {
{this._renderWhatsNew()}
- - + +
Date: Thu, 30 Aug 2018 11:37:33 -0700 Subject: Add title header to use cases section --- packages/website/translations/english.json | 1 + packages/website/ts/pages/landing/landing.tsx | 25 +++++++++++-------------- packages/website/ts/types.ts | 1 + 3 files changed, 13 insertions(+), 14 deletions(-) (limited to 'packages') 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 {
); }); - const titleStyle: React.CSSProperties = { - fontFamily: 'Roboto Mono', - color: colors.grey, - fontWeight: 300, - letterSpacing: 3, - }; return (
-
+
{title}
{projectList}
@@ -517,15 +517,9 @@ export class Landing extends React.Component {
); }); - const titleStyle: React.CSSProperties = { - fontFamily: 'Roboto Mono', - color: colors.grey, - fontWeight: 300, - letterSpacing: 3, - }; return (
-
+
{this.props.translate.get(Key.BenefitsHeader, Deco.Upper)}
@@ -665,6 +659,9 @@ export class Landing extends React.Component { }); return (
+
+ {this.props.translate.get(Key.UseCasesHeader, Deco.Upper)} +
{cases}
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', -- cgit v1.2.3 From 0368de701fa2443a2537d5ea6cb35bdce1ade638 Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Thu, 30 Aug 2018 11:44:09 -0700 Subject: Added todo comments for missing items --- packages/website/ts/pages/landing/landing.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) (limited to 'packages') diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index b32526bba..0aa9693a4 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -41,6 +41,7 @@ interface Project { const THROTTLE_TIMEOUT = 100; const WHATS_NEW_TITLE = 'V2 of the 0x Protocol is now live!'; +// TODO: Update this url const WHATS_NEW_URL = 'https://blog.0xproject.com/18-ideas-for-0x-relayers-in-2018-80a1498b955f'; const TITLE_STYLE: React.CSSProperties = { fontFamily: 'Roboto Mono', @@ -496,7 +497,7 @@ export class Landing extends React.Component { { title: this.props.translate.get(Key.BenefitThreeTitle, Deco.Cap), description: this.props.translate.get(Key.BenefitThreeDescription, Deco.Cap), - imageUrl: '/images/landing/open_source.png', + imageUrl: '/images/landing/open_source.png', // TODO: Update this url classNames: 'right', }, ]; -- cgit v1.2.3 From 365890291f80a0580c8306c8aa498e64da7f86be Mon Sep 17 00:00:00 2001 From: fragosti Date: Wed, 29 Aug 2018 15:02:58 -0700 Subject: Add generic title changes --- packages/website/ts/pages/landing/landing.tsx | 24 +++++++----------------- 1 file changed, 7 insertions(+), 17 deletions(-) (limited to 'packages') diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index 0aa9693a4..72f6bdc9c 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -173,26 +173,16 @@ export class Landing extends React.Component { lineHeight: '36px', }} > -
{this.props.translate.get(Key.TopHeader, Deco.Cap)} -
-
- {this.props.translate.get(Key.TopTagline)} -
+
-- cgit v1.2.3 From 74d5af34ebf1e4d46a3cb13573d0793579454933 Mon Sep 17 00:00:00 2001 From: fragosti Date: Wed, 29 Aug 2018 16:33:08 -0700 Subject: Add TypedText component and use it on landing page --- .../types/react-typist/index.d.ts | 1 + packages/website/package.json | 1 + packages/website/ts/components/ui/text.tsx | 2 + packages/website/ts/components/ui/typed_text.tsx | 75 ++++++++++++++++++++++ packages/website/ts/index.tsx | 1 + packages/website/ts/pages/landing/landing.tsx | 32 +++++++++ 6 files changed, 112 insertions(+) create mode 100644 packages/typescript-typings/types/react-typist/index.d.ts create mode 100644 packages/website/ts/components/ui/typed_text.tsx (limited to 'packages') diff --git a/packages/typescript-typings/types/react-typist/index.d.ts b/packages/typescript-typings/types/react-typist/index.d.ts new file mode 100644 index 000000000..692c596a5 --- /dev/null +++ b/packages/typescript-typings/types/react-typist/index.d.ts @@ -0,0 +1 @@ +declare module 'react-typist'; diff --git a/packages/website/package.json b/packages/website/package.json index 3b6754fb3..a7da19c9e 100644 --- a/packages/website/package.json +++ b/packages/website/package.json @@ -52,6 +52,7 @@ "react-router-dom": "^4.1.1", "react-scroll": "0xproject/react-scroll#similar-to-pr-330", "react-tooltip": "^3.2.7", + "react-typist": "^2.0.4", "redux": "^3.6.0", "redux-devtools-extension": "^2.13.2", "semver-sort": "0.0.4", diff --git a/packages/website/ts/components/ui/text.tsx b/packages/website/ts/components/ui/text.tsx index 734483564..cd8f290e3 100644 --- a/packages/website/ts/components/ui/text.tsx +++ b/packages/website/ts/components/ui/text.tsx @@ -20,6 +20,7 @@ export interface TextProps { onClick?: (event: React.MouseEvent) => void; hoverColor?: string; noWrap?: boolean; + display?: string; } const PlainText: React.StatelessComponent = ({ children, className, onClick, Tag }) => ( @@ -41,6 +42,7 @@ export const Text = styled(PlainText)` ${props => (props.onClick ? 'cursor: pointer' : '')}; transition: color 0.5s ease; ${props => (props.noWrap ? 'white-space: nowrap' : '')}; + ${props => (props.display ? `display: ${props.display}` : '')}; &:hover { ${props => (props.onClick ? `color: ${props.hoverColor || darken(0.3, props.fontColor)}` : '')}; } diff --git a/packages/website/ts/components/ui/typed_text.tsx b/packages/website/ts/components/ui/typed_text.tsx new file mode 100644 index 000000000..a59309139 --- /dev/null +++ b/packages/website/ts/components/ui/typed_text.tsx @@ -0,0 +1,75 @@ +import * as _ from 'lodash'; +import { darken } from 'polished'; +import * as React from 'react'; +import Typist from 'react-typist'; + +import { Text, TextProps } from 'ts/components/ui/text'; + +import 'react-typist/dist/Typist.css'; + +export interface TypedTextProps extends TextProps { + textList: string[]; + shouldRepeat?: boolean; + wordDelayMs?: number; + avgKeystrokeDelayMs?: number; + stdKeystrokeDelay?: number; +} + +export interface TypedTextState { + cycleCount: number; +} + +export class TypedText extends React.Component { + public static defaultProps = { + shouldRepeat: false, + avgKeystrokeDelayMs: 90, + wordDelayMs: 1000, + }; + public state = { + cycleCount: 0, + }; + public render(): React.ReactNode { + const { + textList, + shouldRepeat, + wordDelayMs, + avgKeystrokeDelayMs, + stdKeystrokeDelay, + ...textProps + } = this.props; + const { cycleCount } = this.state; + if (_.isEmpty(textList)) { + return null; + } + const typistChildren: React.ReactNode[] = []; + _.forEach(textList, text => { + typistChildren.push( + + {text} + , + ); + if (wordDelayMs) { + typistChildren.push(); + } + typistChildren.push(); + }); + return ( + + {typistChildren} + + ); + } + private _onTypingDone(): void { + if (this.props.shouldRepeat) { + this.setState({ + cycleCount: this.state.cycleCount + 1, + }); + } + } +} diff --git a/packages/website/ts/index.tsx b/packages/website/ts/index.tsx index 9e59b00ac..6b709df6a 100644 --- a/packages/website/ts/index.tsx +++ b/packages/website/ts/index.tsx @@ -23,6 +23,7 @@ trackedTokenStorage.clearIfRequired(); import 'basscss/css/basscss.css'; import 'less/all.less'; +import 'react-typist/dist/Typist.css'; // We pass modulePromise returning lambda instead of module promise, // cause we only want to import the module when the user navigates to the page. diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index 72f6bdc9c..fc4194849 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -10,6 +10,7 @@ import { CallToAction } from 'ts/components/ui/button'; import { Container } from 'ts/components/ui/container'; import { Image } from 'ts/components/ui/image'; import { Text } from 'ts/components/ui/text'; +import { TypedText } from 'ts/components/ui/typed_text'; import { Dispatcher } from 'ts/redux/dispatcher'; import { Deco, Key, Language, ScreenWidths, WebsitePaths } from 'ts/types'; import { constants } from 'ts/utils/constants'; @@ -43,12 +44,26 @@ const THROTTLE_TIMEOUT = 100; const WHATS_NEW_TITLE = 'V2 of the 0x Protocol is now live!'; // TODO: Update this url const WHATS_NEW_URL = 'https://blog.0xproject.com/18-ideas-for-0x-relayers-in-2018-80a1498b955f'; +<<<<<<< HEAD const TITLE_STYLE: React.CSSProperties = { fontFamily: 'Roboto Mono', color: colors.grey, fontWeight: 300, letterSpacing: 3, }; +======= +const ROTATING_LIST = [ + 'tokens', + 'game items', + 'digital art', + 'outcomes', + 'stocks', + 'derivatives', + 'loans', + 'cats', + 'Everything.', +]; +>>>>>>> Add TypedText component and use it on landing page const relayerProjects: Project[] = [ { @@ -176,12 +191,29 @@ export class Landing extends React.Component { {this.props.translate.get(Key.TopHeader, Deco.Cap)} + {this.props.translate.getLanguage() === Language.English && ( + + {' '} + for{' '} + + + )}
-- cgit v1.2.3 From febddcb356de32c29ff45e885a0c202a03e064cf Mon Sep 17 00:00:00 2001 From: fragosti Date: Wed, 29 Aug 2018 16:39:03 -0700 Subject: Remove redundant import --- packages/website/ts/index.tsx | 1 - 1 file changed, 1 deletion(-) (limited to 'packages') diff --git a/packages/website/ts/index.tsx b/packages/website/ts/index.tsx index 6b709df6a..9e59b00ac 100644 --- a/packages/website/ts/index.tsx +++ b/packages/website/ts/index.tsx @@ -23,7 +23,6 @@ trackedTokenStorage.clearIfRequired(); import 'basscss/css/basscss.css'; import 'less/all.less'; -import 'react-typist/dist/Typist.css'; // We pass modulePromise returning lambda instead of module promise, // cause we only want to import the module when the user navigates to the page. -- cgit v1.2.3 From b1f97a27f3b0114ee1d9e648e0365932217c8dc8 Mon Sep 17 00:00:00 2001 From: fragosti Date: Thu, 30 Aug 2018 11:37:58 -0700 Subject: Final tweaks --- packages/website/ts/components/ui/button.tsx | 1 + packages/website/ts/components/ui/typed_text.tsx | 1 + packages/website/ts/pages/landing/landing.tsx | 26 ++++++++++++++---------- 3 files changed, 17 insertions(+), 11 deletions(-) (limited to 'packages') diff --git a/packages/website/ts/components/ui/button.tsx b/packages/website/ts/components/ui/button.tsx index 2952c8859..75ba7bcff 100644 --- a/packages/website/ts/components/ui/button.tsx +++ b/packages/website/ts/components/ui/button.tsx @@ -96,4 +96,5 @@ export const CallToAction: React.StatelessComponent = ({ CallToAction.defaultProps = { type: 'dark', fontSize: '14px', + padding: '0.9em 1.6em', }; diff --git a/packages/website/ts/components/ui/typed_text.tsx b/packages/website/ts/components/ui/typed_text.tsx index a59309139..2bb2d40b0 100644 --- a/packages/website/ts/components/ui/typed_text.tsx +++ b/packages/website/ts/components/ui/typed_text.tsx @@ -35,6 +35,7 @@ export class TypedText extends React.Component { wordDelayMs, avgKeystrokeDelayMs, stdKeystrokeDelay, + // tslint:disable-next-line ...textProps } = this.props; const { cycleCount } = this.state; diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index fc4194849..5a82576a1 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -61,7 +61,7 @@ const ROTATING_LIST = [ 'derivatives', 'loans', 'cats', - 'Everything.', + 'everything', ]; >>>>>>> Add TypedText component and use it on landing page @@ -170,8 +170,10 @@ export class Landing extends React.Component { } private _renderHero(): React.ReactNode { const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; - const left = 'col lg-col-7 md-col-7 col-12 lg-pl4 md-pl4 sm-pl0 sm-px3 sm-center'; - const flexClassName = isSmallScreen ? 'flex items-center flex-column' : 'flex items-center'; + const left = 'col lg-col-6 md-col-6 col-12 lg-pl4 md-pl4 sm-pl0 sm-px3 sm-center'; + const flexClassName = isSmallScreen + ? 'flex items-center flex-column justify-center' + : 'flex items-center justify-center'; return (
@@ -194,7 +196,7 @@ export class Landing extends React.Component { display="inline-block" fontColor={colors.grey300} fontWeight={500} - lineHeight="1.2em" + lineHeight="1.3em" fontSize={isSmallScreen ? '28px' : '36px'} > {this.props.translate.get(Key.TopHeader, Deco.Cap)} @@ -207,7 +209,7 @@ export class Landing extends React.Component { display="inline-block" fontColor={colors.white} fontWeight={700} - lineHeight="1.2em" + lineHeight="1.3em" fontSize={isSmallScreen ? '28px' : '36px'} textList={ROTATING_LIST} shouldRepeat={true} @@ -215,17 +217,19 @@ export class Landing extends React.Component { )} - -
+ + - + {this.props.translate.get(Key.BuildCallToAction, Deco.Cap)} -
-
+ +
- + {this.props.translate.get(Key.TradeCallToAction, Deco.Cap)} -- cgit v1.2.3 From fd5ad69c268ef5411901d8ff24e429a7e0b4f888 Mon Sep 17 00:00:00 2001 From: fragosti Date: Thu, 30 Aug 2018 11:47:55 -0700 Subject: Add careers page to top bar --- packages/website/ts/components/top_bar/top_bar.tsx | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) (limited to 'packages') diff --git a/packages/website/ts/components/top_bar/top_bar.tsx b/packages/website/ts/components/top_bar/top_bar.tsx index 8580c3a6e..1841d890b 100644 --- a/packages/website/ts/components/top_bar/top_bar.tsx +++ b/packages/website/ts/components/top_bar/top_bar.tsx @@ -238,7 +238,7 @@ export class TopBar extends React.Component { const fullWidthClasses = isExpandedDisplayType ? 'pr4' : ''; const logoUrl = isNightVersion ? '/images/protocol_logo_white.png' : '/images/protocol_logo_black.png'; const menuClasses = `col col-${ - isExpandedDisplayType ? '4' : '5' + isExpandedDisplayType ? '4' : '6' } ${fullWidthClasses} lg-pr0 md-pr2 sm-hide xs-hide`; const menuIconStyle = { fontSize: 25, @@ -301,6 +301,13 @@ export class TopBar extends React.Component { isNightVersion={isNightVersion} isExternal={false} /> + { {this.props.translate.get(Key.About, Deco.Cap)} + + {this.props.translate.get(Key.Careers, Deco.Cap)} + {this.props.translate.get(Key.Blog, Deco.Cap)} -- cgit v1.2.3 From c3361bb86e4b022c65b7dc657827b78efca9be41 Mon Sep 17 00:00:00 2001 From: fragosti Date: Thu, 30 Aug 2018 11:52:08 -0700 Subject: Remove conflict strings --- packages/website/ts/pages/landing/landing.tsx | 3 --- 1 file changed, 3 deletions(-) (limited to 'packages') diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index 5a82576a1..c8dc2fc74 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -44,14 +44,12 @@ const THROTTLE_TIMEOUT = 100; const WHATS_NEW_TITLE = 'V2 of the 0x Protocol is now live!'; // TODO: Update this url const WHATS_NEW_URL = 'https://blog.0xproject.com/18-ideas-for-0x-relayers-in-2018-80a1498b955f'; -<<<<<<< HEAD const TITLE_STYLE: React.CSSProperties = { fontFamily: 'Roboto Mono', color: colors.grey, fontWeight: 300, letterSpacing: 3, }; -======= const ROTATING_LIST = [ 'tokens', 'game items', @@ -63,7 +61,6 @@ const ROTATING_LIST = [ 'cats', 'everything', ]; ->>>>>>> Add TypedText component and use it on landing page const relayerProjects: Project[] = [ { -- cgit v1.2.3 From 60f1bcf51f0917607582d6027329fd292c7fc251 Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Thu, 30 Aug 2018 12:09:54 -0700 Subject: Remove unused render methods in landing page --- packages/website/ts/pages/landing/landing.tsx | 110 -------------------------- 1 file changed, 110 deletions(-) (limited to 'packages') diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index c8dc2fc74..d29abf835 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -366,116 +366,6 @@ export class Landing extends React.Component {
); } - private _renderProtocolSection(): React.ReactNode { - const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; - return ( -
-
-
- -
-
-
-
-
{this.props.translate.get(Key.OffChainOrderRelay, Deco.Cap)}
-
{this.props.translate.get(Key.OnChainSettlement, Deco.Cap)}
-
-
- {this.props.translate.get(Key.OffChainOnChainDescription, Deco.Cap)} -
-
-
-
-
- ); - } - private _renderBuildingBlocksSection(): React.ReactNode { - const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; - const descriptionStyle: React.CSSProperties = { - fontFamily: 'Roboto Mono', - lineHeight: isSmallScreen ? 1.5 : 2, - fontWeight: 300, - fontSize: 15, - maxWidth: isSmallScreen ? 375 : 'none', - }; - const callToActionStyle: React.CSSProperties = { - fontFamily: 'Roboto Mono', - fontSize: 15, - fontWeight: 300, - maxWidth: isSmallScreen ? 375 : 441, - }; - return ( -
-
- {isSmallScreen && this._renderBlockChipImage()} -
-
- {this.props.translate.get(Key.BuildingBlockSectionHeader, Deco.Cap)} -
-
- {this.props.translate.get(Key.BuildingBlockSectionDescription, Deco.Cap)} -
-
- {this.props.translate.get(Key.DevToolsPrompt, Deco.Cap)}{' '} - - 0x.js - {' '} - {this.props.translate.get(Key.And)}{' '} - - {this.props.translate.get(Key.SmartContract)} - {' '} - {this.props.translate.get(Key.Docs)} -
-
- {!isSmallScreen && this._renderBlockChipImage()} -
-
- ); - } - private _renderBlockChipImage(): React.ReactNode { - const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; - return ( -
- -
- ); - } private _renderTokenCloud(): React.ReactNode { const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; return ( -- cgit v1.2.3 From e90dbf66f33d7d37ec07803df930a3c955eb4e73 Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Thu, 30 Aug 2018 12:29:47 -0700 Subject: Add new exchange everywhere graphic --- .../public/images/landing/exchange_everywhere.png | Bin 0 -> 7084 bytes packages/website/ts/pages/landing/landing.tsx | 12 ++++++++---- 2 files changed, 8 insertions(+), 4 deletions(-) create mode 100644 packages/website/public/images/landing/exchange_everywhere.png (limited to 'packages') diff --git a/packages/website/public/images/landing/exchange_everywhere.png b/packages/website/public/images/landing/exchange_everywhere.png new file mode 100644 index 000000000..e63093929 Binary files /dev/null and b/packages/website/public/images/landing/exchange_everywhere.png differ diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index d29abf835..e2b4d8f80 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -410,7 +410,7 @@ export class Landing extends React.Component { { title: this.props.translate.get(Key.BenefitThreeTitle, Deco.Cap), description: this.props.translate.get(Key.BenefitThreeDescription, Deco.Cap), - imageUrl: '/images/landing/open_source.png', // TODO: Update this url + imageUrl: '/images/landing/exchange_everywhere.png', classNames: 'right', }, ]; @@ -418,9 +418,13 @@ export class Landing extends React.Component { return (
-
- -
+ + +
{boxContent.title}
-- cgit v1.2.3 From a224ce347e3ee15b7bb3992a3f59d1576b07b46a Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Thu, 30 Aug 2018 13:21:07 -0700 Subject: Revert whats new text --- packages/website/ts/pages/landing/landing.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) (limited to 'packages') diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index e2b4d8f80..34f124d8c 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -41,8 +41,7 @@ interface Project { } const THROTTLE_TIMEOUT = 100; -const WHATS_NEW_TITLE = 'V2 of the 0x Protocol is now live!'; -// TODO: Update this url +const WHATS_NEW_TITLE = '18 ideas for 0x relayers in 2018'; const WHATS_NEW_URL = 'https://blog.0xproject.com/18-ideas-for-0x-relayers-in-2018-80a1498b955f'; const TITLE_STYLE: React.CSSProperties = { fontFamily: 'Roboto Mono', -- cgit v1.2.3