aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website
diff options
context:
space:
mode:
Diffstat (limited to 'packages/website')
-rw-r--r--packages/website/less/all.less41
-rw-r--r--packages/website/package.json8
-rw-r--r--packages/website/public/images/landing/project_logos/amadeus.pngbin0 -> 6156 bytes
-rw-r--r--packages/website/public/images/landing/project_logos/ddex.pngbin0 -> 5504 bytes
-rw-r--r--packages/website/public/images/landing/project_logos/decent_ex.pngbin0 -> 5100 bytes
-rw-r--r--packages/website/public/images/landing/project_logos/dextroid.pngbin0 -> 5609 bytes
-rw-r--r--packages/website/public/images/landing/project_logos/ercdex.pngbin0 -> 5726 bytes
-rw-r--r--packages/website/public/images/landing/project_logos/ethfinex-top.pngbin4376 -> 0 bytes
-rw-r--r--packages/website/public/images/landing/project_logos/ethfinex.pngbin0 -> 5486 bytes
-rw-r--r--packages/website/public/images/landing/project_logos/idt.pngbin0 -> 3154 bytes
-rw-r--r--packages/website/public/images/landing/project_logos/open_relay.pngbin0 -> 6149 bytes
-rw-r--r--packages/website/public/images/landing/project_logos/paradex.pngbin0 -> 5725 bytes
-rw-r--r--packages/website/public/images/landing/project_logos/paradex_top.pngbin5109 -> 0 bytes
-rw-r--r--packages/website/public/images/landing/project_logos/radar_relay.pngbin0 -> 5748 bytes
-rw-r--r--packages/website/public/images/landing/project_logos/radar_relay_top.pngbin4898 -> 0 bytes
-rw-r--r--packages/website/ts/components/token_balances.tsx40
-rw-r--r--packages/website/ts/components/top_bar/top_bar.tsx10
-rw-r--r--packages/website/ts/components/top_bar/top_bar_menu_item.tsx18
-rw-r--r--packages/website/ts/pages/landing/landing.tsx160
-rw-r--r--packages/website/ts/utils/configs.ts24
-rw-r--r--packages/website/ts/utils/constants.ts9
-rw-r--r--packages/website/ts/utils/utils.ts11
22 files changed, 214 insertions, 107 deletions
diff --git a/packages/website/less/all.less b/packages/website/less/all.less
index 5212df959..7f2a8fc67 100644
--- a/packages/website/less/all.less
+++ b/packages/website/less/all.less
@@ -21,14 +21,19 @@ a {
}
#landing {
- .h1, .h2, .h3, .h4 {
+ .h1,
+ .h2,
+ .h3,
+ .h4 {
font-family: 'Roboto Mono';
}
}
-
#portal {
- h1, h2, h3, h4 {
+ h1,
+ h2,
+ h3,
+ h4 {
font-weight: 100;
}
}
@@ -55,13 +60,13 @@ a {
* Source: https://davidwalsh.name/osx-overflow
*/
::-webkit-scrollbar {
- -webkit-appearance: none;
- width: 7px;
+ -webkit-appearance: none;
+ width: 7px;
}
::-webkit-scrollbar-thumb {
- border-radius: 4px;
- background-color: rgba(0, 0, 0, .5);
- -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5);
+ border-radius: 4px;
+ background-color: rgba(0, 0, 0, 0.5);
+ -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);
}
// Hack: For some reason the animation applied to the material-ui textfield causes the overflow
@@ -87,18 +92,24 @@ code {
&.hljs {
background-color: #dde4e9 !important; // blue gray
- border-left: 5px solid #0091EA !important; // colors.lightBlueA700
+ border-left: 5px solid #0091ea !important; // colors.lightBlueA700
padding: 30px;
}
}
#wiki {
- p, blockquote, ul, ol, dl, li, table, pre {
+ p,
+ blockquote,
+ ol,
+ dl,
+ li,
+ table,
+ pre {
margin: 15px 0;
}
- ol, ul {
- padding-bottom: 20px;
+ li {
+ margin: 5px 0;
}
table {
@@ -127,10 +138,12 @@ code {
margin: 0;
padding: 6px 13px;
}
- table tr th :first-child, table tr td :first-child {
+ table tr th :first-child,
+ table tr td :first-child {
margin-top: 0;
}
- table tr th :last-child, table tr td :last-child {
+ table tr th :last-child,
+ table tr td :last-child {
margin-bottom: 0;
}
}
diff --git a/packages/website/package.json b/packages/website/package.json
index f7d0ab978..c8fc78474 100644
--- a/packages/website/package.json
+++ b/packages/website/package.json
@@ -1,6 +1,6 @@
{
"name": "@0xproject/website",
- "version": "0.0.12",
+ "version": "0.0.13",
"private": true,
"description": "Website and 0x portal dapp",
"scripts": {
@@ -18,9 +18,9 @@
"author": "Fabio Berger",
"license": "Apache-2.0",
"dependencies": {
- "0x.js": "^0.32.0",
- "@0xproject/subproviders": "^0.3.6",
- "@0xproject/utils": "^0.3.0",
+ "0x.js": "^0.32.1",
+ "@0xproject/subproviders": "^0.4.0",
+ "@0xproject/utils": "^0.3.1",
"accounting": "^0.4.1",
"basscss": "^8.0.3",
"blockies": "^0.0.2",
diff --git a/packages/website/public/images/landing/project_logos/amadeus.png b/packages/website/public/images/landing/project_logos/amadeus.png
new file mode 100644
index 000000000..e3926b79f
--- /dev/null
+++ b/packages/website/public/images/landing/project_logos/amadeus.png
Binary files differ
diff --git a/packages/website/public/images/landing/project_logos/ddex.png b/packages/website/public/images/landing/project_logos/ddex.png
new file mode 100644
index 000000000..a1a8def26
--- /dev/null
+++ b/packages/website/public/images/landing/project_logos/ddex.png
Binary files differ
diff --git a/packages/website/public/images/landing/project_logos/decent_ex.png b/packages/website/public/images/landing/project_logos/decent_ex.png
new file mode 100644
index 000000000..1fac76947
--- /dev/null
+++ b/packages/website/public/images/landing/project_logos/decent_ex.png
Binary files differ
diff --git a/packages/website/public/images/landing/project_logos/dextroid.png b/packages/website/public/images/landing/project_logos/dextroid.png
new file mode 100644
index 000000000..5fdcd7f8e
--- /dev/null
+++ b/packages/website/public/images/landing/project_logos/dextroid.png
Binary files differ
diff --git a/packages/website/public/images/landing/project_logos/ercdex.png b/packages/website/public/images/landing/project_logos/ercdex.png
new file mode 100644
index 000000000..1367837e0
--- /dev/null
+++ b/packages/website/public/images/landing/project_logos/ercdex.png
Binary files differ
diff --git a/packages/website/public/images/landing/project_logos/ethfinex-top.png b/packages/website/public/images/landing/project_logos/ethfinex-top.png
deleted file mode 100644
index 5eda914ca..000000000
--- a/packages/website/public/images/landing/project_logos/ethfinex-top.png
+++ /dev/null
Binary files differ
diff --git a/packages/website/public/images/landing/project_logos/ethfinex.png b/packages/website/public/images/landing/project_logos/ethfinex.png
new file mode 100644
index 000000000..5aa0c556f
--- /dev/null
+++ b/packages/website/public/images/landing/project_logos/ethfinex.png
Binary files differ
diff --git a/packages/website/public/images/landing/project_logos/idt.png b/packages/website/public/images/landing/project_logos/idt.png
new file mode 100644
index 000000000..859c289d2
--- /dev/null
+++ b/packages/website/public/images/landing/project_logos/idt.png
Binary files differ
diff --git a/packages/website/public/images/landing/project_logos/open_relay.png b/packages/website/public/images/landing/project_logos/open_relay.png
new file mode 100644
index 000000000..fa1853df6
--- /dev/null
+++ b/packages/website/public/images/landing/project_logos/open_relay.png
Binary files differ
diff --git a/packages/website/public/images/landing/project_logos/paradex.png b/packages/website/public/images/landing/project_logos/paradex.png
new file mode 100644
index 000000000..7948eb938
--- /dev/null
+++ b/packages/website/public/images/landing/project_logos/paradex.png
Binary files differ
diff --git a/packages/website/public/images/landing/project_logos/paradex_top.png b/packages/website/public/images/landing/project_logos/paradex_top.png
deleted file mode 100644
index 3fe9472b9..000000000
--- a/packages/website/public/images/landing/project_logos/paradex_top.png
+++ /dev/null
Binary files differ
diff --git a/packages/website/public/images/landing/project_logos/radar_relay.png b/packages/website/public/images/landing/project_logos/radar_relay.png
new file mode 100644
index 000000000..af0e610f8
--- /dev/null
+++ b/packages/website/public/images/landing/project_logos/radar_relay.png
Binary files differ
diff --git a/packages/website/public/images/landing/project_logos/radar_relay_top.png b/packages/website/public/images/landing/project_logos/radar_relay_top.png
deleted file mode 100644
index 737159959..000000000
--- a/packages/website/public/images/landing/project_logos/radar_relay_top.png
+++ /dev/null
Binary files differ
diff --git a/packages/website/ts/components/token_balances.tsx b/packages/website/ts/components/token_balances.tsx
index dfb62bbb3..894edf0a8 100644
--- a/packages/website/ts/components/token_balances.tsx
+++ b/packages/website/ts/components/token_balances.tsx
@@ -118,7 +118,8 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
if (nextProps.userEtherBalance !== this.props.userEtherBalance) {
if (this.state.isBalanceSpinnerVisible) {
const receivedAmount = nextProps.userEtherBalance.minus(this.props.userEtherBalance);
- this.props.dispatcher.showFlashMessage(`Received ${receivedAmount.toString(10)} Kovan Ether`);
+ const networkName = constants.NETWORK_NAME_BY_ID[this.props.networkId];
+ this.props.dispatcher.showFlashMessage(`Received ${receivedAmount.toString(10)} ${networkName} Ether`);
}
this.setState({
isBalanceSpinnerVisible: false,
@@ -176,13 +177,14 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
onTouchTap={this._onDharmaDialogToggle.bind(this, false)}
/>,
];
+ const isTestNetwork = utils.isTestNetwork(this.props.networkId);
const isKovanTestNetwork = this.props.networkId === constants.NETWORK_ID_KOVAN;
const dharmaButtonColumnStyle = {
paddingLeft: 3,
display: isKovanTestNetwork ? 'table-cell' : 'none',
};
const stubColumnStyle = {
- display: isKovanTestNetwork ? 'none' : 'table-cell',
+ display: isTestNetwork ? 'none' : 'table-cell',
};
const allTokenRowHeight = _.size(this.props.tokenByAddress) * TOKEN_TABLE_ROW_HEIGHT;
const tokenTableHeight =
@@ -201,10 +203,10 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
smart contract so you can start trading that token.';
return (
<div className="lg-px4 md-px4 sm-px1 pb2">
- <h3>{isKovanTestNetwork ? 'Test ether' : 'Ether'}</h3>
+ <h3>{isTestNetwork ? 'Test ether' : 'Ether'}</h3>
<Divider />
<div className="pt2 pb2">
- {isKovanTestNetwork
+ {isTestNetwork
? 'In order to try out the 0x Portal Dapp, request some test ether to pay for \
gas costs. It might take a bit of time for the test ether to show up.'
: 'Ether must be converted to Ether Tokens in order to be tradable via 0x. \
@@ -216,7 +218,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
<TableHeaderColumn>Currency</TableHeaderColumn>
<TableHeaderColumn>Balance</TableHeaderColumn>
<TableRowColumn className="sm-hide xs-hide" style={stubColumnStyle} />
- {isKovanTestNetwork && (
+ {isTestNetwork && (
<TableHeaderColumn style={{ paddingLeft: 3 }}>
{isSmallScreen ? 'Faucet' : 'Request from faucet'}
</TableHeaderColumn>
@@ -243,7 +245,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
)}
</TableRowColumn>
<TableRowColumn className="sm-hide xs-hide" style={stubColumnStyle} />
- {isKovanTestNetwork && (
+ {isTestNetwork && (
<TableRowColumn style={{ paddingLeft: 3 }}>
<LifeCycleRaisedButton
labelReady="Request"
@@ -267,7 +269,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
</Table>
<div className="clearfix" style={{ paddingBottom: 1 }}>
<div className="col col-10">
- <h3 className="pt2">{isKovanTestNetwork ? 'Test tokens' : 'Tokens'}</h3>
+ <h3 className="pt2">{isTestNetwork ? 'Test tokens' : 'Tokens'}</h3>
</div>
<div className="col col-1 pt3 align-right">
<FloatingActionButton mini={true} zDepth={0} onClick={this._onAddTokenClicked.bind(this)}>
@@ -282,7 +284,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
</div>
<Divider />
<div className="pt2 pb2">
- {isKovanTestNetwork
+ {isTestNetwork
? "Mint some test tokens you'd like to use to generate or fill an order using 0x."
: "Set trading permissions for a token you'd like to start trading."}
</div>
@@ -362,8 +364,13 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
EtherscanLinkSuffixes.Address,
);
const isMintable =
- _.includes(configs.SYMBOLS_OF_MINTABLE_TOKENS, token.symbol) &&
- this.props.networkId !== constants.NETWORK_ID_MAINNET;
+ (_.includes(configs.SYMBOLS_OF_MINTABLE_KOVAN_TOKENS, token.symbol) &&
+ this.props.networkId === constants.NETWORK_ID_BY_NAME[Networks.Kovan]) ||
+ (_.includes(configs.SYMBOLS_OF_MINTABLE_RINKEBY_ROPSTEN_TOKENS, token.symbol) &&
+ _.includes(
+ [constants.NETWORK_ID_BY_NAME[Networks.Rinkeby], constants.NETWORK_ID_BY_NAME[Networks.Ropsten]],
+ this.props.networkId,
+ ));
return (
<TableRow key={token.address} style={{ height: TOKEN_TABLE_ROW_HEIGHT }}>
<TableRowColumn colSpan={tokenColSpan}>
@@ -413,7 +420,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
/>
)}
{token.symbol === ZRX_TOKEN_SYMBOL &&
- this.props.networkId === constants.NETWORK_ID_KOVAN && (
+ utils.isTestNetwork(this.props.networkId) && (
<LifeCycleRaisedButton
labelReady="Request"
labelLoading="Sending..."
@@ -498,9 +505,8 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
case BalanceErrs.incorrectNetworkForFaucet:
return (
<div>
- Our faucet can only send test Ether to addresses on the {Networks.Kovan} testnet (networkId{' '}
- {constants.NETWORK_ID_KOVAN}). Please make sure you are connected to the {Networks.Kovan}{' '}
- testnet and try requesting ether again.
+ Our faucet can only send test Ether to addresses on testnets. Please make sure you are connected
+ to a testnet and try requesting again.
</div>
);
@@ -589,7 +595,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
// If on another network other then the testnet our faucet serves test ether
// from, we must show user an error message
- if (this.props.blockchain.networkId !== constants.NETWORK_ID_KOVAN) {
+ if (!utils.isTestNetwork(this.props.blockchain.networkId)) {
this.setState({
errorType: BalanceErrs.incorrectNetworkForFaucet,
});
@@ -599,7 +605,9 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
await utils.sleepAsync(ARTIFICIAL_FAUCET_REQUEST_DELAY);
const segment = isEtherRequest ? 'ether' : 'zrx';
- const response = await fetch(`${constants.URL_ETHER_FAUCET}/${segment}/${this.props.userAddress}`);
+ const response = await fetch(
+ `${constants.URL_TESTNET_FAUCET}/${segment}/${this.props.userAddress}?networkId=${this.props.networkId}`,
+ );
const responseBody = await response.text();
if (response.status !== constants.SUCCESS_STATUS) {
utils.consoleLog(`Unexpected status code: ${response.status} -> ${responseBody}`);
diff --git a/packages/website/ts/components/top_bar/top_bar.tsx b/packages/website/ts/components/top_bar/top_bar.tsx
index 1a0691e83..b1367be4f 100644
--- a/packages/website/ts/components/top_bar/top_bar.tsx
+++ b/packages/website/ts/components/top_bar/top_bar.tsx
@@ -169,12 +169,21 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> {
path={`${WebsitePaths.Wiki}`}
style={styles.menuItem}
isNightVersion={isNightVersion}
+ isExternal={false}
+ />
+ <TopBarMenuItem
+ title="Blog"
+ path={constants.URL_BLOG}
+ style={styles.menuItem}
+ isNightVersion={isNightVersion}
+ isExternal={true}
/>
<TopBarMenuItem
title="About"
path={`${WebsitePaths.About}`}
style={styles.menuItem}
isNightVersion={isNightVersion}
+ isExternal={false}
/>
<TopBarMenuItem
title="Portal DApp"
@@ -183,6 +192,7 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> {
style={styles.menuItem}
className={`${isFullWidthPage && 'md-hide'}`}
isNightVersion={isNightVersion}
+ isExternal={false}
/>
</div>
</div>
diff --git a/packages/website/ts/components/top_bar/top_bar_menu_item.tsx b/packages/website/ts/components/top_bar/top_bar_menu_item.tsx
index 96ee86142..983050abc 100644
--- a/packages/website/ts/components/top_bar/top_bar_menu_item.tsx
+++ b/packages/website/ts/components/top_bar/top_bar_menu_item.tsx
@@ -11,6 +11,7 @@ interface TopBarMenuItemProps {
title: string;
path?: string;
isPrimary?: boolean;
+ isExternal: boolean;
style?: React.CSSProperties;
className?: string;
isNightVersion?: boolean;
@@ -43,9 +44,20 @@ export class TopBarMenuItem extends React.Component<TopBarMenuItemProps, TopBarM
className={`center ${this.props.className}`}
style={{ ...this.props.style, ...primaryStyles, color: menuItemColor }}
>
- <Link to={this.props.path} className="text-decoration-none" style={{ color: linkColor }}>
- {this.props.title}
- </Link>
+ {this.props.isExternal ? (
+ <a
+ className="text-decoration-none"
+ style={{ color: linkColor }}
+ target="_blank"
+ href={this.props.path}
+ >
+ {this.props.title}
+ </a>
+ ) : (
+ <Link to={this.props.path} className="text-decoration-none" style={{ color: linkColor }}>
+ {this.props.title}
+ </Link>
+ )}
</div>
);
}
diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx
index b0c622fb4..d4c934459 100644
--- a/packages/website/ts/pages/landing/landing.tsx
+++ b/packages/website/ts/pages/landing/landing.tsx
@@ -65,17 +65,17 @@ const boxContents: BoxContent[] = [
},
];
-const projects: Project[] = [
+const relayersAndDappProjects: Project[] = [
{
- logoFileName: 'ethfinex-top.png',
+ logoFileName: 'ethfinex.png',
projectUrl: constants.PROJECT_URL_ETHFINEX,
},
{
- logoFileName: 'radar_relay_top.png',
+ logoFileName: 'radar_relay.png',
projectUrl: constants.PROJECT_URL_RADAR_RELAY,
},
{
- logoFileName: 'paradex_top.png',
+ logoFileName: 'paradex.png',
projectUrl: constants.PROJECT_URL_PARADEX,
},
{
@@ -132,6 +132,57 @@ const projects: Project[] = [
},
];
+const relayerProjects: Project[] = [
+ {
+ logoFileName: 'ethfinex.png',
+ projectUrl: constants.PROJECT_URL_ETHFINEX,
+ },
+ {
+ 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: 'amadeus.png',
+ projectUrl: constants.PROJECT_URL_AMADEUS,
+ },
+ {
+ logoFileName: 'ddex.png',
+ projectUrl: constants.PROJECT_URL_DDEX,
+ },
+ {
+ logoFileName: 'decent_ex.png',
+ projectUrl: constants.PROJECT_URL_DECENT_EX,
+ },
+ {
+ logoFileName: 'dextroid.png',
+ projectUrl: constants.PROJECT_URL_DEXTROID,
+ },
+ {
+ logoFileName: 'ercdex.png',
+ projectUrl: constants.PROJECT_URL_ERC_DEX,
+ },
+ {
+ logoFileName: 'open_relay.png',
+ projectUrl: constants.PROJECT_URL_OPEN_RELAY,
+ },
+ {
+ logoFileName: 'idt.png',
+ projectUrl: constants.PROJECT_URL_IDT,
+ },
+];
+
export interface LandingProps {
location: Location;
}
@@ -167,9 +218,10 @@ export class Landing extends React.Component<LandingProps, LandingState> {
style={{ backgroundColor: colors.heroGrey, position: 'relative' }}
/>
{this._renderHero()}
- {this._renderProjects()}
+ {this._renderProjects(relayersAndDappProjects, 'Projects building on 0x', colors.projectsGrey, false)}
{this._renderTokenizationSection()}
{this._renderProtocolSection()}
+ {this._renderProjects(relayerProjects, 'Relayers building on 0x', colors.heroGrey, true)}
{this._renderInfoBoxes()}
{this._renderBuildingBlocksSection()}
{this._renderUseCases()}
@@ -259,11 +311,25 @@ export class Landing extends React.Component<LandingProps, LandingState> {
</div>
);
}
- private _renderProjects() {
+ private _renderProjects(projects: Project[], title: string, backgroundColor: string, isTitleCenter: boolean) {
const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm;
const isMediumScreen = this.state.screenWidth === ScreenWidths.Md;
const projectList = _.map(projects, (project: Project, i: number) => {
- const colWidth = isSmallScreen ? 3 : isMediumScreen ? 4 : 2 - i % 2;
+ const isRelayersOnly = projects.length === 12;
+ let colWidth: number;
+ switch (this.state.screenWidth) {
+ case ScreenWidths.Sm:
+ colWidth = 4;
+ break;
+
+ case ScreenWidths.Md:
+ colWidth = 3;
+ break;
+
+ case ScreenWidths.Lg:
+ colWidth = isRelayersOnly ? 2 : 2 - i % 2;
+ break;
+ }
return (
<div key={`project-${project.logoFileName}`} className={`col col-${colWidth} center`}>
<div>
@@ -285,10 +351,10 @@ export class Landing extends React.Component<LandingProps, LandingState> {
letterSpacing: 3,
};
return (
- <div className="clearfix py4" style={{ backgroundColor: colors.projectsGrey }}>
+ <div className={`clearfix py4 ${isTitleCenter && 'center'}`} style={{ backgroundColor }}>
<div className="mx-auto max-width-4 clearfix sm-px3">
- <div className="h4 pb3 md-pl3 sm-pl2" style={titleStyle}>
- Projects building on 0x
+ <div className="h4 pb3 lg-pl0 md-pl3 sm-pl2" style={titleStyle}>
+ {title}
</div>
<div className="clearfix">{projectList}</div>
<div
@@ -319,7 +385,7 @@ export class Landing extends React.Component<LandingProps, LandingState> {
<div className="clearfix lg-py4 md-py4 sm-pb4 sm-pt2" style={{ backgroundColor: colors.grey100 }}>
<div className="mx-auto max-width-4 py4 clearfix">
{isSmallScreen && this._renderTokenCloud()}
- <div className="col lg-col-6 md-col-6 col-12">
+ <div className="col lg-col-6 md-col-6 col-12" style={{ color: colors.darkestGrey }}>
<div className="mx-auto" style={{ maxWidth: 385, paddingTop: 7 }}>
<div className="lg-h1 md-h1 sm-h2 sm-center sm-pt3" style={{ fontFamily: 'Roboto Mono' }}>
The world's value is becoming tokenized
@@ -358,16 +424,15 @@ export class Landing extends React.Component<LandingProps, LandingState> {
private _renderProtocolSection() {
const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm;
return (
- <div className="clearfix lg-py4 md-py4 sm-pt4" style={{ backgroundColor: colors.heroGrey }}>
- <div className="mx-auto max-width-4 lg-py4 md-py4 sm-pt4 clearfix">
+ <div className="clearfix pt4" style={{ backgroundColor: colors.heroGrey }}>
+ <div className="mx-auto max-width-4 pt4 clearfix">
<div className="col lg-col-6 md-col-6 col-12 sm-center">
<img src="/images/landing/relayer_diagram.png" height={isSmallScreen ? 326 : 426} />
</div>
<div
- className="col lg-col-6 md-col-6 col-12 lg-pr3 md-pr3 sm-mx-auto"
+ className="col lg-col-6 md-col-6 col-12 lg-pr3 md-pr3 sm-mx-auto lg-pt4 md-pt4 lg-mt3 md-mt3"
style={{
color: colors.beigeWhite,
- paddingTop: 8,
maxWidth: isSmallScreen ? 'none' : 445,
}}
>
@@ -388,57 +453,6 @@ export class Landing extends React.Component<LandingProps, LandingState> {
eliminating blockchain bloat. Relayers help broadcast orders and collect a fee each time
they facilitate a trade. Anyone can build a relayer.
</div>
- <div
- className="pt3 sm-mx-auto sm-px3"
- style={{
- color: colors.landingLinkGrey,
- maxWidth: isSmallScreen ? 412 : 'none',
- }}
- >
- <div className="flex" style={{ fontSize: 18 }}>
- <div
- className="lg-h4 md-h4 sm-h5"
- style={{
- letterSpacing: isSmallScreen ? 1 : 3,
- fontFamily: 'Roboto Mono',
- }}
- >
- RELAYERS BUILDING ON 0X
- </div>
- <div className="h5" style={{ marginLeft: isSmallScreen ? 26 : 49 }}>
- <Link
- to={`${WebsitePaths.Wiki}#List-of-Projects-Using-0x-Protocol`}
- className="text-decoration-none underline"
- style={{
- color: colors.landingLinkGrey,
- fontFamily: 'Roboto Mono',
- }}
- >
- view all
- </Link>
- </div>
- </div>
- <div className="lg-flex md-flex sm-clearfix pt3" style={{ opacity: 0.4 }}>
- <div className="col col-4 sm-center">
- <img
- src="/images/landing/ethfinex.png"
- style={{ height: isSmallScreen ? 85 : 107 }}
- />
- </div>
- <div className="col col-4 center">
- <img
- src="/images/landing/radar_relay.png"
- style={{ height: isSmallScreen ? 85 : 107 }}
- />
- </div>
- <div className="col col-4 sm-center" style={{ textAlign: 'right' }}>
- <img
- src="/images/landing/paradex.png"
- style={{ height: isSmallScreen ? 85 : 107 }}
- />
- </div>
- </div>
- </div>
</div>
</div>
</div>
@@ -551,7 +565,7 @@ export class Landing extends React.Component<LandingProps, LandingState> {
fontFamily: 'Roboto Mono',
fontSize: 13.5,
fontWeight: 400,
- opacity: 0.75,
+ color: colors.darkestGrey,
}}
>
{assetType.title}
@@ -587,9 +601,19 @@ export class Landing extends React.Component<LandingProps, LandingState> {
</div>
);
});
+ const titleStyle: React.CSSProperties = {
+ fontFamily: 'Roboto Mono',
+ color: colors.grey,
+ textTransform: 'uppercase',
+ fontWeight: 300,
+ letterSpacing: 3,
+ };
return (
<div className="clearfix" style={{ backgroundColor: colors.heroGrey }}>
- <div className="mx-auto py4 sm-mt2 clearfix" style={{ maxWidth: '60em' }}>
+ <div className="center pb3 pt4" style={titleStyle}>
+ Benefits of 0x
+ </div>
+ <div className="mx-auto pb4 sm-mt2 clearfix" style={{ maxWidth: '60em' }}>
{boxes}
</div>
</div>
diff --git a/packages/website/ts/utils/configs.ts b/packages/website/ts/utils/configs.ts
index 874ad04c2..69773eae7 100644
--- a/packages/website/ts/utils/configs.ts
+++ b/packages/website/ts/utils/configs.ts
@@ -124,5 +124,27 @@ export const configs = {
[4]: [`https://rinkeby.infura.io/${INFURA_API_KEY}`],
} as PublicNodeUrlsByNetworkId,
SHOULD_DEPRECATE_OLD_WETH_TOKEN: true,
- SYMBOLS_OF_MINTABLE_TOKENS: ['MKR', 'MLN', 'GNT', 'DGD', 'REP'],
+ SYMBOLS_OF_MINTABLE_KOVAN_TOKENS: ['MKR', 'MLN', 'GNT', 'DGD', 'REP'],
+ SYMBOLS_OF_MINTABLE_RINKEBY_ROPSTEN_TOKENS: [
+ 'TKN0',
+ 'TKN1',
+ 'TKN2',
+ 'TKN3',
+ 'TKN4',
+ 'TKN5',
+ 'TKN6',
+ 'TKN7',
+ 'TKN8',
+ 'TKN9',
+ 'TKN10',
+ 'TKN11',
+ 'TKN12',
+ 'TKN13',
+ 'TKN14',
+ 'TKN15',
+ 'TKN16',
+ 'TKN17',
+ 'TKN18',
+ 'TKN19',
+ ],
};
diff --git a/packages/website/ts/utils/constants.ts b/packages/website/ts/utils/constants.ts
index 26a793f38..6af821dbe 100644
--- a/packages/website/ts/utils/constants.ts
+++ b/packages/website/ts/utils/constants.ts
@@ -48,6 +48,12 @@ export const constants = {
TESTNET_NAME: 'Kovan',
TYPES_SECTION_NAME: 'types',
PROJECT_URL_ETHFINEX: 'https://www.bitfinex.com/ethfinex',
+ PROJECT_URL_AMADEUS: 'http://amadeusrelay.org',
+ PROJECT_URL_DDEX: 'https://ddex.io',
+ PROJECT_URL_DECENT_EX: 'https://decent.exchange',
+ PROJECT_URL_DEXTROID: 'https://www.dextroid.io',
+ PROJECT_URL_ERC_DEX: 'https://ercdex.com',
+ PROJECT_URL_OPEN_RELAY: 'https://openrelay.xyz',
PROJECT_URL_RADAR_RELAY: 'https://radarrelay.com',
PROJECT_URL_PARADEX: 'https://paradex.io',
PROJECT_URL_DYDX: 'https://dydx.exchange',
@@ -63,13 +69,14 @@ export const constants = {
PROJECT_URL_AUGUR: 'https://augur.net',
PROJECT_URL_AUCTUS: 'https://auctus.org',
PROJECT_URL_OPEN_ANX: 'https://www.openanx.org',
+ PROJECT_URL_IDT: 'https://kinalpha.com',
URL_ANGELLIST: 'https://angel.co/0xproject/jobs',
URL_BIGNUMBERJS_GITHUB: 'http://mikemcl.github.io/bignumber.js',
URL_BITLY_API: 'https://api-ssl.bitly.com',
URL_BLOG: 'https://blog.0xproject.com/latest',
URL_DISCOURSE_FORUM: 'https://forum.0xproject.com',
URL_FIREFOX_U2F_ADDON: 'https://addons.mozilla.org/en-US/firefox/addon/u2f-support-add-on/',
- URL_ETHER_FAUCET: 'https://faucet.0xproject.com',
+ URL_TESTNET_FAUCET: 'https://faucet.0xproject.com',
URL_GITHUB_ORG: 'https://github.com/0xProject',
URL_GITHUB_WIKI: 'https://github.com/0xProject/wiki',
URL_METAMASK_CHROME_STORE: 'https://chrome.google.com/webstore/detail/metamask/nkbihfbeogaeaoehlefnkodbefgpgknn',
diff --git a/packages/website/ts/utils/utils.ts b/packages/website/ts/utils/utils.ts
index 68eb7c813..c38f84c92 100644
--- a/packages/website/ts/utils/utils.ts
+++ b/packages/website/ts/utils/utils.ts
@@ -279,4 +279,15 @@ export const utils = {
isTestRpc(nodeVersion: string): boolean {
return _.includes(nodeVersion, 'TestRPC');
},
+ isTestNetwork(networkId: number): boolean {
+ const isTestNetwork = _.includes(
+ [
+ constants.NETWORK_ID_BY_NAME[Networks.Kovan],
+ constants.NETWORK_ID_BY_NAME[Networks.Rinkeby],
+ constants.NETWORK_ID_BY_NAME[Networks.Ropsten],
+ ],
+ networkId,
+ );
+ return isTestNetwork;
+ },
};