aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts/components
diff options
context:
space:
mode:
Diffstat (limited to 'packages/website/ts/components')
-rw-r--r--packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx1
-rw-r--r--packages/website/ts/components/dialogs/u2f_not_supported_dialog.tsx2
-rw-r--r--packages/website/ts/components/eth_weth_conversion_button.tsx1
-rw-r--r--packages/website/ts/components/eth_wrappers.tsx2
-rw-r--r--packages/website/ts/components/fill_order.tsx2
-rw-r--r--packages/website/ts/components/fill_warning_dialog.tsx2
-rw-r--r--packages/website/ts/components/flash_messages/token_send_completed.tsx3
-rw-r--r--packages/website/ts/components/flash_messages/transaction_submitted.tsx3
-rw-r--r--packages/website/ts/components/footer.tsx6
-rw-r--r--packages/website/ts/components/generate_order/generate_order_form.tsx2
-rw-r--r--packages/website/ts/components/generate_order/new_token_form.tsx2
-rw-r--r--packages/website/ts/components/inputs/address_input.tsx2
-rw-r--r--packages/website/ts/components/inputs/balance_bounded_input.tsx4
-rw-r--r--packages/website/ts/components/inputs/token_amount_input.tsx4
-rw-r--r--packages/website/ts/components/inputs/token_input.tsx2
-rw-r--r--packages/website/ts/components/portal.tsx11
-rw-r--r--packages/website/ts/components/token_balances.tsx4
-rw-r--r--packages/website/ts/components/top_bar.tsx7
-rw-r--r--packages/website/ts/components/top_bar_menu_item.tsx4
-rw-r--r--packages/website/ts/components/track_token_confirmation.tsx2
-rw-r--r--packages/website/ts/components/trade_history/trade_history_item.tsx2
-rw-r--r--packages/website/ts/components/ui/copy_icon.tsx2
-rw-r--r--packages/website/ts/components/ui/etherscan_icon.tsx2
-rw-r--r--packages/website/ts/components/ui/input_label.tsx2
-rw-r--r--packages/website/ts/components/ui/lifecycle_raised_button.tsx4
-rw-r--r--packages/website/ts/components/ui/required_label.tsx2
-rw-r--r--packages/website/ts/components/ui/swap_icon.tsx2
27 files changed, 43 insertions, 39 deletions
diff --git a/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx b/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx
index 96533defc..44c23e4b0 100644
--- a/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx
+++ b/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx
@@ -6,7 +6,6 @@ import {EthAmountInput} from 'ts/components/inputs/eth_amount_input';
import {TokenAmountInput} from 'ts/components/inputs/token_amount_input';
import {Side, Token, TokenState} from 'ts/types';
import {colors} from 'ts/utils/colors';
-import {constants} from 'ts/utils/constants';
interface EthWethConversionDialogProps {
direction: Side;
diff --git a/packages/website/ts/components/dialogs/u2f_not_supported_dialog.tsx b/packages/website/ts/components/dialogs/u2f_not_supported_dialog.tsx
index e2bef63c7..83042624d 100644
--- a/packages/website/ts/components/dialogs/u2f_not_supported_dialog.tsx
+++ b/packages/website/ts/components/dialogs/u2f_not_supported_dialog.tsx
@@ -1,7 +1,7 @@
import Dialog from 'material-ui/Dialog';
import FlatButton from 'material-ui/FlatButton';
-import {colors} from 'ts/utils/colors';
import * as React from 'react';
+import {colors} from 'ts/utils/colors';
import {constants} from 'ts/utils/constants';
interface U2fNotSupportedDialogProps {
diff --git a/packages/website/ts/components/eth_weth_conversion_button.tsx b/packages/website/ts/components/eth_weth_conversion_button.tsx
index 4f218286d..5464f8df0 100644
--- a/packages/website/ts/components/eth_weth_conversion_button.tsx
+++ b/packages/website/ts/components/eth_weth_conversion_button.tsx
@@ -7,7 +7,6 @@ import {Blockchain} from 'ts/blockchain';
import {EthWethConversionDialog} from 'ts/components/dialogs/eth_weth_conversion_dialog';
import {Dispatcher} from 'ts/redux/dispatcher';
import {BlockchainCallErrs, Side, Token, TokenState} from 'ts/types';
-import {configs} from 'ts/utils/configs';
import {constants} from 'ts/utils/constants';
import {errorReporter} from 'ts/utils/error_reporter';
import {utils} from 'ts/utils/utils';
diff --git a/packages/website/ts/components/eth_wrappers.tsx b/packages/website/ts/components/eth_wrappers.tsx
index fb1205b62..ef1379e59 100644
--- a/packages/website/ts/components/eth_wrappers.tsx
+++ b/packages/website/ts/components/eth_wrappers.tsx
@@ -2,7 +2,6 @@ import {ZeroEx} from '0x.js';
import BigNumber from 'bignumber.js';
import * as _ from 'lodash';
import Divider from 'material-ui/Divider';
-import {colors} from 'ts/utils/colors';
import {
Table,
TableBody,
@@ -24,6 +23,7 @@ import {
TokenState,
TokenStateByAddress,
} from 'ts/types';
+import {colors} from 'ts/utils/colors';
import {configs} from 'ts/utils/configs';
import {constants} from 'ts/utils/constants';
diff --git a/packages/website/ts/components/fill_order.tsx b/packages/website/ts/components/fill_order.tsx
index f91540c26..c96dfe27a 100644
--- a/packages/website/ts/components/fill_order.tsx
+++ b/packages/website/ts/components/fill_order.tsx
@@ -323,7 +323,7 @@ export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
Order successfully filled. See the trade details in your{' '}
<Link
to={`${WebsitePaths.Portal}/trades`}
- style={{color: 'white'}}
+ style={{color: colors.white}}
>
trade history
</Link>
diff --git a/packages/website/ts/components/fill_warning_dialog.tsx b/packages/website/ts/components/fill_warning_dialog.tsx
index e6642d450..7370ee2d8 100644
--- a/packages/website/ts/components/fill_warning_dialog.tsx
+++ b/packages/website/ts/components/fill_warning_dialog.tsx
@@ -1,7 +1,7 @@
import Dialog from 'material-ui/Dialog';
import FlatButton from 'material-ui/FlatButton';
-import {colors} from 'ts/utils/colors';
import * as React from 'react';
+import {colors} from 'ts/utils/colors';
interface FillWarningDialogProps {
isOpen: boolean;
diff --git a/packages/website/ts/components/flash_messages/token_send_completed.tsx b/packages/website/ts/components/flash_messages/token_send_completed.tsx
index fef7520f6..26619c54f 100644
--- a/packages/website/ts/components/flash_messages/token_send_completed.tsx
+++ b/packages/website/ts/components/flash_messages/token_send_completed.tsx
@@ -3,6 +3,7 @@ import BigNumber from 'bignumber.js';
import * as _ from 'lodash';
import * as React from 'react';
import {Token} from 'ts/types';
+import {colors} from 'ts/utils/colors';
import {utils} from 'ts/utils/utils';
interface TokenSendCompletedProps {
@@ -19,7 +20,7 @@ export class TokenSendCompleted extends React.Component<TokenSendCompletedProps,
const etherScanLink = !_.isUndefined(this.props.etherScanLinkIfExists) &&
(
<a
- style={{color: 'white'}}
+ style={{color: colors.white}}
href={`${this.props.etherScanLinkIfExists}`}
target="_blank"
>
diff --git a/packages/website/ts/components/flash_messages/transaction_submitted.tsx b/packages/website/ts/components/flash_messages/transaction_submitted.tsx
index cef3e2b1e..64f460e20 100644
--- a/packages/website/ts/components/flash_messages/transaction_submitted.tsx
+++ b/packages/website/ts/components/flash_messages/transaction_submitted.tsx
@@ -1,5 +1,6 @@
import * as _ from 'lodash';
import * as React from 'react';
+import {colors} from 'ts/utils/colors';
interface TransactionSubmittedProps {
etherScanLinkIfExists?: string;
@@ -16,7 +17,7 @@ export class TransactionSubmitted extends React.Component<TransactionSubmittedPr
<div>
Transaction submitted to the network:{' '}
<a
- style={{color: 'white'}}
+ style={{color: colors.white}}
href={`${this.props.etherScanLinkIfExists}`}
target="_blank"
>
diff --git a/packages/website/ts/components/footer.tsx b/packages/website/ts/components/footer.tsx
index 4b03c49e6..82e046a59 100644
--- a/packages/website/ts/components/footer.tsx
+++ b/packages/website/ts/components/footer.tsx
@@ -98,7 +98,7 @@ const menuItemsBySection: MenuItemsBySection = {
],
};
const linkStyle = {
- color: 'white',
+ color: colors.white,
cursor: 'pointer',
};
@@ -116,8 +116,8 @@ interface FooterState {}
export class Footer extends React.Component<FooterProps, FooterState> {
public render() {
return (
- <div className="relative pb4 pt2" style={{backgroundColor: colors.darkerGray}}>
- <div className="mx-auto max-width-4 md-px2 lg-px0 py4 clearfix" style={{color: 'white'}}>
+ <div className="relative pb4 pt2" style={{backgroundColor: colors.darkerGrey}}>
+ <div className="mx-auto max-width-4 md-px2 lg-px0 py4 clearfix" style={{color: colors.white}}>
<div className="col lg-col-4 md-col-4 col-12 left">
<div className="sm-mx-auto" style={{width: 148}}>
<div>
diff --git a/packages/website/ts/components/generate_order/generate_order_form.tsx b/packages/website/ts/components/generate_order/generate_order_form.tsx
index 587fdc6f1..5479f0f83 100644
--- a/packages/website/ts/components/generate_order/generate_order_form.tsx
+++ b/packages/website/ts/components/generate_order/generate_order_form.tsx
@@ -3,7 +3,6 @@ import BigNumber from 'bignumber.js';
import * as _ from 'lodash';
import Dialog from 'material-ui/Dialog';
import Divider from 'material-ui/Divider';
-import {colors} from 'ts/utils/colors';
import * as React from 'react';
import {Blockchain} from 'ts/blockchain';
import {ExpirationInput} from 'ts/components/inputs/expiration_input';
@@ -30,6 +29,7 @@ import {
TokenByAddress,
TokenStateByAddress,
} from 'ts/types';
+import {colors} from 'ts/utils/colors';
import {errorReporter} from 'ts/utils/error_reporter';
import {utils} from 'ts/utils/utils';
diff --git a/packages/website/ts/components/generate_order/new_token_form.tsx b/packages/website/ts/components/generate_order/new_token_form.tsx
index 604a54b18..6c3c01d0d 100644
--- a/packages/website/ts/components/generate_order/new_token_form.tsx
+++ b/packages/website/ts/components/generate_order/new_token_form.tsx
@@ -1,6 +1,5 @@
import BigNumber from 'bignumber.js';
import * as _ from 'lodash';
-import {colors} from 'ts/utils/colors';
import TextField from 'material-ui/TextField';
import * as React from 'react';
import {Blockchain} from 'ts/blockchain';
@@ -9,6 +8,7 @@ import {Alert} from 'ts/components/ui/alert';
import {LifeCycleRaisedButton} from 'ts/components/ui/lifecycle_raised_button';
import {RequiredLabel} from 'ts/components/ui/required_label';
import {AlertTypes, Token, TokenByAddress, TokenState} from 'ts/types';
+import {colors} from 'ts/utils/colors';
interface NewTokenFormProps {
blockchain: Blockchain;
diff --git a/packages/website/ts/components/inputs/address_input.tsx b/packages/website/ts/components/inputs/address_input.tsx
index d432a038e..a17b6e3f5 100644
--- a/packages/website/ts/components/inputs/address_input.tsx
+++ b/packages/website/ts/components/inputs/address_input.tsx
@@ -1,9 +1,9 @@
import {addressUtils} from '@0xproject/utils';
import * as _ from 'lodash';
-import {colors} from 'ts/utils/colors';
import TextField from 'material-ui/TextField';
import * as React from 'react';
import {RequiredLabel} from 'ts/components/ui/required_label';
+import {colors} from 'ts/utils/colors';
interface AddressInputProps {
disabled?: boolean;
diff --git a/packages/website/ts/components/inputs/balance_bounded_input.tsx b/packages/website/ts/components/inputs/balance_bounded_input.tsx
index 0b92a5856..61ab34f25 100644
--- a/packages/website/ts/components/inputs/balance_bounded_input.tsx
+++ b/packages/website/ts/components/inputs/balance_bounded_input.tsx
@@ -1,11 +1,11 @@
import BigNumber from 'bignumber.js';
import * as _ from 'lodash';
-import {colors} from 'ts/utils/colors';
import TextField from 'material-ui/TextField';
import * as React from 'react';
import {Link} from 'react-router-dom';
import {RequiredLabel} from 'ts/components/ui/required_label';
import {InputErrMsg, ValidatedBigNumberCallback, WebsitePaths} from 'ts/types';
+import {colors} from 'ts/utils/colors';
import {utils} from 'ts/utils/utils';
interface BalanceBoundedInputProps {
@@ -133,7 +133,7 @@ export class BalanceBoundedInput extends
const increaseBalanceText = 'Increase balance';
const linkStyle = {
cursor: 'pointer',
- color: colors.darkestGray,
+ color: colors.darkestGrey,
textDecoration: 'underline',
display: 'inline',
};
diff --git a/packages/website/ts/components/inputs/token_amount_input.tsx b/packages/website/ts/components/inputs/token_amount_input.tsx
index ddf0d3307..c9728dc5f 100644
--- a/packages/website/ts/components/inputs/token_amount_input.tsx
+++ b/packages/website/ts/components/inputs/token_amount_input.tsx
@@ -1,11 +1,11 @@
import {ZeroEx} from '0x.js';
import BigNumber from 'bignumber.js';
import * as _ from 'lodash';
-import {colors} from 'ts/utils/colors';
import * as React from 'react';
import {Link} from 'react-router-dom';
import {BalanceBoundedInput} from 'ts/components/inputs/balance_bounded_input';
import {InputErrMsg, Token, TokenState, ValidatedBigNumberCallback, WebsitePaths} from 'ts/types';
+import {colors} from 'ts/utils/colors';
interface TokenAmountInputProps {
token: Token;
@@ -59,7 +59,7 @@ export class TokenAmountInput extends React.Component<TokenAmountInputProps, Tok
Insufficient allowance.{' '}
<Link
to={`${WebsitePaths.Portal}/balances`}
- style={{cursor: 'pointer', color: colors.darkestGray}}
+ style={{cursor: 'pointer', color: colors.darkestGrey}}
>
Set allowance
</Link>
diff --git a/packages/website/ts/components/inputs/token_input.tsx b/packages/website/ts/components/inputs/token_input.tsx
index 806c8b21f..7008da12f 100644
--- a/packages/website/ts/components/inputs/token_input.tsx
+++ b/packages/website/ts/components/inputs/token_input.tsx
@@ -1,6 +1,5 @@
import * as _ from 'lodash';
import Paper from 'material-ui/Paper';
-import {colors} from 'ts/utils/colors';
import * as React from 'react';
import {Blockchain} from 'ts/blockchain';
import {AssetPicker} from 'ts/components/generate_order/asset_picker';
@@ -8,6 +7,7 @@ import {InputLabel} from 'ts/components/ui/input_label';
import {TokenIcon} from 'ts/components/ui/token_icon';
import {Dispatcher} from 'ts/redux/dispatcher';
import {AssetToken, BlockchainErrs, Side, Token, TokenByAddress} from 'ts/types';
+import {colors} from 'ts/utils/colors';
const TOKEN_ICON_DIMENSION = 80;
diff --git a/packages/website/ts/components/portal.tsx b/packages/website/ts/components/portal.tsx
index ea076205e..c292e0a92 100644
--- a/packages/website/ts/components/portal.tsx
+++ b/packages/website/ts/components/portal.tsx
@@ -1,7 +1,6 @@
import BigNumber from 'bignumber.js';
import * as _ from 'lodash';
import Paper from 'material-ui/Paper';
-import {colors} from 'ts/utils/colors';
import * as React from 'react';
import * as DocumentTitle from 'react-document-title';
import {Route, Switch} from 'react-router-dom';
@@ -32,6 +31,7 @@ import {
TokenStateByAddress,
WebsitePaths,
} from 'ts/types';
+import {colors} from 'ts/utils/colors';
import {configs} from 'ts/utils/configs';
import {constants} from 'ts/utils/constants';
import {utils} from 'ts/utils/utils';
@@ -138,6 +138,11 @@ export class Portal extends React.Component<PortalAllProps, PortalAllState> {
flexDirection: 'column',
justifyContent: 'space-between',
};
+ const portalMenuContainerStyle: React.CSSProperties = {
+ overflow: 'hidden',
+ backgroundColor: colors.darkestGrey,
+ color: colors.white,
+ };
return (
<div style={portalStyle}>
<DocumentTitle title="0x Portal DApp"/>
@@ -171,9 +176,9 @@ export class Portal extends React.Component<PortalAllProps, PortalAllState> {
<div className="mx-auto flex">
<div
className="col col-2 pr2 pt1 sm-hide xs-hide"
- style={{overflow: 'hidden', backgroundColor: colors.darkestGray, color: 'white'}}
+ style={portalMenuContainerStyle}
>
- <PortalMenu menuItemStyle={{color: 'white'}} />
+ <PortalMenu menuItemStyle={{color: colors.white}} />
</div>
<div className="col col-12 lg-col-10 md-col-10 sm-col sm-col-12">
<div className="py2" style={{backgroundColor: colors.grey50}}>
diff --git a/packages/website/ts/components/token_balances.tsx b/packages/website/ts/components/token_balances.tsx
index a3c577a2e..61aea6a88 100644
--- a/packages/website/ts/components/token_balances.tsx
+++ b/packages/website/ts/components/token_balances.tsx
@@ -7,7 +7,6 @@ import Divider from 'material-ui/Divider';
import FlatButton from 'material-ui/FlatButton';
import FloatingActionButton from 'material-ui/FloatingActionButton';
import RaisedButton from 'material-ui/RaisedButton';
-import {colors} from 'ts/utils/colors';
import ContentAdd from 'material-ui/svg-icons/content/add';
import ContentRemove from 'material-ui/svg-icons/content/remove';
import {
@@ -42,6 +41,7 @@ import {
TokenStateByAddress,
TokenVisibility,
} from 'ts/types';
+import {colors} from 'ts/utils/colors';
import {configs} from 'ts/utils/configs';
import {constants} from 'ts/utils/constants';
import {errorReporter} from 'ts/utils/error_reporter';
@@ -334,7 +334,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
<Dialog
title="Request Dharma Loan"
titleStyle={{fontWeight: 100, backgroundColor: colors.white}}
- bodyStyle={{backgroundColor: colors.dharmaDarkGray}}
+ bodyStyle={{backgroundColor: colors.dharmaDarkGrey}}
actionsContainerStyle={{backgroundColor: colors.white}}
autoScrollBodyContent={true}
actions={dharmaDialogActions}
diff --git a/packages/website/ts/components/top_bar.tsx b/packages/website/ts/components/top_bar.tsx
index 179840ffc..73bdfacca 100644
--- a/packages/website/ts/components/top_bar.tsx
+++ b/packages/website/ts/components/top_bar.tsx
@@ -12,7 +12,6 @@ import {DocsInfo} from 'ts/pages/documentation/docs_info';
import {NestedSidebarMenu} from 'ts/pages/shared/nested_sidebar_menu';
import {DocsMenu, MenuSubsectionsBySection, Styles, WebsitePaths} from 'ts/types';
import {colors} from 'ts/utils/colors';
-import {configs} from 'ts/utils/configs';
import {constants} from 'ts/utils/constants';
interface TopBarProps {
@@ -44,11 +43,11 @@ const styles: Styles = {
},
addressPopover: {
backgroundColor: colors.blueGrey500,
- color: 'white',
+ color: colors.white,
padding: 3,
},
topBar: {
- backgroundColor: 'white',
+ backgroundcolor: colors.white,
height: 59,
width: '100%',
position: 'fixed',
@@ -61,7 +60,7 @@ const styles: Styles = {
},
menuItem: {
fontSize: 14,
- color: colors.darkestGray,
+ color: colors.darkestGrey,
paddingTop: 6,
paddingBottom: 6,
marginTop: 17,
diff --git a/packages/website/ts/components/top_bar_menu_item.tsx b/packages/website/ts/components/top_bar_menu_item.tsx
index d912abe06..64cb48b2e 100644
--- a/packages/website/ts/components/top_bar_menu_item.tsx
+++ b/packages/website/ts/components/top_bar_menu_item.tsx
@@ -4,7 +4,7 @@ import {Link} from 'react-router-dom';
import {colors} from 'ts/utils/colors';
const DEFAULT_STYLE = {
- color: colors.darkestGray,
+ color: colors.darkestGrey,
};
interface TopBarMenuItemProps {
@@ -36,7 +36,7 @@ export class TopBarMenuItem extends React.Component<TopBarMenuItemProps, TopBarM
} : {};
const menuItemColor = this.props.isNightVersion ? 'white' : this.props.style.color;
const linkColor = _.isUndefined(menuItemColor) ?
- colors.darkestGray :
+ colors.darkestGrey :
menuItemColor;
return (
<div
diff --git a/packages/website/ts/components/track_token_confirmation.tsx b/packages/website/ts/components/track_token_confirmation.tsx
index 2cda34c1a..ff840fe8c 100644
--- a/packages/website/ts/components/track_token_confirmation.tsx
+++ b/packages/website/ts/components/track_token_confirmation.tsx
@@ -1,8 +1,8 @@
import * as _ from 'lodash';
-import {colors} from 'ts/utils/colors';
import * as React from 'react';
import {Party} from 'ts/components/ui/party';
import {Token, TokenByAddress} from 'ts/types';
+import {colors} from 'ts/utils/colors';
import {utils} from 'ts/utils/utils';
interface TrackTokenConfirmationProps {
diff --git a/packages/website/ts/components/trade_history/trade_history_item.tsx b/packages/website/ts/components/trade_history/trade_history_item.tsx
index 27d5c1e03..d2a334df9 100644
--- a/packages/website/ts/components/trade_history/trade_history_item.tsx
+++ b/packages/website/ts/components/trade_history/trade_history_item.tsx
@@ -2,13 +2,13 @@ import {ZeroEx} from '0x.js';
import BigNumber from 'bignumber.js';
import * as _ from 'lodash';
import Paper from 'material-ui/Paper';
-import {colors} from 'ts/utils/colors';
import * as moment from 'moment';
import * as React from 'react';
import * as ReactTooltip from 'react-tooltip';
import {EtherScanIcon} from 'ts/components/ui/etherscan_icon';
import {Party} from 'ts/components/ui/party';
import {EtherscanLinkSuffixes, Fill, Token, TokenByAddress} from 'ts/types';
+import {colors} from 'ts/utils/colors';
const PRECISION = 5;
const IDENTICON_DIAMETER = 40;
diff --git a/packages/website/ts/components/ui/copy_icon.tsx b/packages/website/ts/components/ui/copy_icon.tsx
index d3a0f47ee..3c50430df 100644
--- a/packages/website/ts/components/ui/copy_icon.tsx
+++ b/packages/website/ts/components/ui/copy_icon.tsx
@@ -1,9 +1,9 @@
import * as _ from 'lodash';
-import {colors} from 'ts/utils/colors';
import * as React from 'react';
import * as CopyToClipboard from 'react-copy-to-clipboard';
import * as ReactDOM from 'react-dom';
import ReactTooltip = require('react-tooltip');
+import {colors} from 'ts/utils/colors';
interface CopyIconProps {
data: string;
diff --git a/packages/website/ts/components/ui/etherscan_icon.tsx b/packages/website/ts/components/ui/etherscan_icon.tsx
index 2778fc085..111d5d478 100644
--- a/packages/website/ts/components/ui/etherscan_icon.tsx
+++ b/packages/website/ts/components/ui/etherscan_icon.tsx
@@ -1,8 +1,8 @@
import * as _ from 'lodash';
-import {colors} from 'ts/utils/colors';
import * as React from 'react';
import ReactTooltip = require('react-tooltip');
import {EtherscanLinkSuffixes} from 'ts/types';
+import {colors} from 'ts/utils/colors';
import {utils} from 'ts/utils/utils';
interface EtherScanIconProps {
diff --git a/packages/website/ts/components/ui/input_label.tsx b/packages/website/ts/components/ui/input_label.tsx
index 43f101d11..bfa1da280 100644
--- a/packages/website/ts/components/ui/input_label.tsx
+++ b/packages/website/ts/components/ui/input_label.tsx
@@ -1,5 +1,5 @@
-import {colors} from 'ts/utils/colors';
import * as React from 'react';
+import {colors} from 'ts/utils/colors';
export interface InputLabelProps {
text: string | Element | React.ReactNode;
diff --git a/packages/website/ts/components/ui/lifecycle_raised_button.tsx b/packages/website/ts/components/ui/lifecycle_raised_button.tsx
index 1856a6b50..08e8bc9ce 100644
--- a/packages/website/ts/components/ui/lifecycle_raised_button.tsx
+++ b/packages/website/ts/components/ui/lifecycle_raised_button.tsx
@@ -32,8 +32,8 @@ export class LifeCycleRaisedButton extends
React.Component<LifeCycleRaisedButtonProps, LifeCycleRaisedButtonState> {
public static defaultProps: Partial<LifeCycleRaisedButtonProps> = {
isDisabled: false,
- backgroundColor: 'white',
- labelColor: colors.darkGray,
+ backgroundColor: colors.white,
+ labelColor: colors.darkGrey,
};
private buttonTimeoutId: number;
private didUnmount: boolean;
diff --git a/packages/website/ts/components/ui/required_label.tsx b/packages/website/ts/components/ui/required_label.tsx
index 3166ae0e7..979b06d66 100644
--- a/packages/website/ts/components/ui/required_label.tsx
+++ b/packages/website/ts/components/ui/required_label.tsx
@@ -1,5 +1,5 @@
-import {colors} from 'ts/utils/colors';
import * as React from 'react';
+import {colors} from 'ts/utils/colors';
export interface RequiredLabelProps {
label: string|React.ReactNode;
diff --git a/packages/website/ts/components/ui/swap_icon.tsx b/packages/website/ts/components/ui/swap_icon.tsx
index 0f65bf449..124e7018c 100644
--- a/packages/website/ts/components/ui/swap_icon.tsx
+++ b/packages/website/ts/components/ui/swap_icon.tsx
@@ -1,6 +1,6 @@
import * as _ from 'lodash';
-import {colors} from 'ts/utils/colors';
import * as React from 'react';
+import {colors} from 'ts/utils/colors';
interface SwapIconProps {
swapTokensFn: () => void;