Merge branch 'development' into feature/portal-ledger-support

* development: (437 commits)
  Publish
  Update yarn.lock
  Update the CHANGELOG
  Fix the bug making it impossible to specify the custom ZRX address
  Fix fill/cancel order by looking for NoError instead of empty blockchainErr given the BlockchainErrs type refactor
  Add a comment about a yarn bug
  Add our mainnet and kovan nodes as backups for Portal requests
  Fix bug hiding the user info from topBar
  Add dev-utils package to top level README
  Prettier newline
  Prettier
  Allow Token symbols to be alphanumeric
  Update CHANGELOG, rebase on development
  Should not -> cannot
  Reject negative amounts in isValidBaseUnitAmount
  Re-add changelog for 0x.js
  Fix prettier
  Update yarn.lock
  Move tests to a separate folder
  Change file layout
  ...

# Conflicts:
#	packages/website/README.md

1 files changed, 16 insertions, 17 deletions

diff --git a/packages/website/ts/components/top_bar_menu_item.tsx b/packages/website/ts/components/top_bar_menu_item.tsx
index de429fba6..96ee86142 100644
--- a/packages/website/ts/components/top_bar_menu_item.tsx
+++ b/packages/website/ts/components/top_bar_menu_item.tsx
@@ -1,11 +1,10 @@
 import * as _ from 'lodash';
 import * as React from 'react';
-import {Link} from 'react-router-dom';
-import {Styles} from 'ts/types';
+import { Link } from 'react-router-dom';
+import { colors } from 'ts/utils/colors';
 
-const CUSTOM_DARK_GRAY = '#231F20';
 const DEFAULT_STYLE = {
-    color: CUSTOM_DARK_GRAY,
+    color: colors.darkestGrey,
 };
 
 interface TopBarMenuItemProps {
@@ -27,24 +26,24 @@ export class TopBarMenuItem extends React.Component<TopBarMenuItemProps, TopBarM
         isNightVersion: false,
     };
     public render() {
-        const primaryStyles = this.props.isPrimary ? {
-            borderRadius: 4,
-            border: `1px solid ${this.props.isNightVersion ? '#979797' : 'rgb(230, 229, 229)'}`,
-            marginTop: 15,
-            paddingLeft: 9,
-            paddingRight: 9,
-            width: 77,
-        } : {};
+        const primaryStyles = this.props.isPrimary
+            ? {
+                  borderRadius: 4,
+                  border: `1px solid ${this.props.isNightVersion ? colors.grey : colors.greyishPink}`,
+                  marginTop: 15,
+                  paddingLeft: 9,
+                  paddingRight: 9,
+                  width: 77,
+              }
+            : {};
         const menuItemColor = this.props.isNightVersion ? 'white' : this.props.style.color;
-        const linkColor = _.isUndefined(menuItemColor) ?
-            CUSTOM_DARK_GRAY :
-            menuItemColor;
+        const linkColor = _.isUndefined(menuItemColor) ? colors.darkestGrey : menuItemColor;
         return (
             <div
                 className={`center ${this.props.className}`}
-                style={{...this.props.style, ...primaryStyles, color: menuItemColor}}
+                style={{ ...this.props.style, ...primaryStyles, color: menuItemColor }}
             >
-                <Link to={this.props.path} className="text-decoration-none" style={{color: linkColor}}>
+                <Link to={this.props.path} className="text-decoration-none" style={{ color: linkColor }}>
                     {this.props.title}
                 </Link>
             </div>