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/ts/components/token_balances.tsx40
-rw-r--r--packages/website/ts/utils/configs.ts24
-rw-r--r--packages/website/ts/utils/constants.ts2
-rw-r--r--packages/website/ts/utils/utils.ts11
6 files changed, 90 insertions, 36 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/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/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..3df4c9370 100644
--- a/packages/website/ts/utils/constants.ts
+++ b/packages/website/ts/utils/constants.ts
@@ -69,7 +69,7 @@ export const constants = {
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 7e69b1c5f..a7865d41b 100644
--- a/packages/website/ts/utils/utils.ts
+++ b/packages/website/ts/utils/utils.ts
@@ -282,4 +282,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;
+ },
};