Merge branch 'development' into fix/dev-tools-pages/finalTouches

* development: (87 commits)
  Update packages/sol-tracing-utils/src/trace_collection_subprovider.ts
  Make mapping namings direct
  Remove unused tslint disable
  Revert "Remove logAsyncErrors hack"
  Remove logAsyncErrors hack
  Refactor logAsyncErrors to follow our conventions
  Export Sources and SourceCodes out of tracing utils
  Replace console.log with logUtils.log (#1515)
  strict decoding of return values using generics
  makerAssetFillAmount -> takerAssetFillAmount
  Ran prettier
  Linter
  Fix build after rebase
  Style cleanup for Compressed Calldata in Contract Wrappers PR
  Use simpler `_.find` to locate fillOrderBai
  Updated dutch auction wrapper
  Added back abi-gen-wrappers
  Renamed signatureParser.ts to signature_parser.ts
  Renamed decode rule `structsAsObjects` to `shouldConvertStructsToObjects`
  circle build failed. New commit to resubmit job.
  ...

16 files changed, 114 insertions, 111 deletions

diff --git a/packages/website/package.json b/packages/website/package.json
index af43fabf9..475af4d61 100644
--- a/packages/website/package.json
+++ b/packages/website/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@0x/website",
-    "version": "0.0.64",
+    "version": "0.0.65",
     "engines": {
         "node": ">=6.12"
     },
@@ -20,18 +20,18 @@
     "author": "Fabio Berger",
     "license": "Apache-2.0",
     "dependencies": {
-        "@0x/asset-buyer": "^3.0.5",
+        "@0x/asset-buyer": "^4.0.0",
         "@0x/contract-addresses": "^2.1.0",
-        "@0x/contract-wrappers": "^4.2.0",
-        "@0x/json-schemas": "^2.1.5",
-        "@0x/order-utils": "^3.1.0",
-        "@0x/react-docs": "^1.0.23",
-        "@0x/react-shared": "^1.1.0",
-        "@0x/subproviders": "^2.1.9",
-        "@0x/types": "^1.5.0",
-        "@0x/typescript-typings": "^3.0.4",
-        "@0x/utils": "^2.1.1",
-        "@0x/web3-wrapper": "^3.2.2",
+        "@0x/contract-wrappers": "^4.2.1",
+        "@0x/json-schemas": "^2.1.6",
+        "@0x/order-utils": "^3.1.1",
+        "@0x/react-docs": "^1.0.24",
+        "@0x/react-shared": "^1.1.1",
+        "@0x/subproviders": "^2.1.10",
+        "@0x/types": "^1.5.1",
+        "@0x/typescript-typings": "^3.0.7",
+        "@0x/utils": "^3.0.0",
+        "@0x/web3-wrapper": "^3.2.3",
         "@reach/dialog": "^0.1.2",
         "@types/react-lazyload": "^2.3.1",
         "@types/react-loadable": "^5.4.2",
@@ -42,7 +42,7 @@
         "blockies": "^0.0.2",
         "bowser": "^1.9.3",
         "deep-equal": "^1.0.1",
-        "ethereum-types": "^1.1.4",
+        "ethereum-types": "^1.1.5",
         "ethereumjs-util": "^5.1.1",
         "find-versions": "^2.0.0",
         "jsonschema": "^1.2.0",
@@ -54,18 +54,20 @@
         "polished": "^1.9.2",
         "query-string": "^6.0.0",
         "rc-slider": "^8.6.3",
-        "react": "^16.4.2",
+        "react": "^16.5.2",
         "react-copy-to-clipboard": "^5.0.0",
         "react-document-title": "^2.0.3",
-        "react-dom": "^16.4.2",
+        "react-dom": "^16.5.2",
         "react-flickity-component": "^3.1.0",
         "react-headroom": "2.2.2",
         "react-helmet": "^5.2.0",
         "react-lazyload": "^2.3.0",
         "react-loadable": "^5.5.0",
+        "react-markdown": "^4.0.6",
         "react-popper": "^1.0.0-beta.6",
         "react-redux": "^5.0.3",
         "react-responsive": "^6.0.1",
+        "react-router-dom": "^4.3.1",
         "react-scroll": "0xproject/react-scroll#pr-330-and-replace-state",
         "react-scrollable-anchor": "^0.6.1",
         "react-syntax-highlighter": "^10.1.1",
diff --git a/packages/website/public/css/basscss.min.css b/packages/website/public/css/basscss.min.css
new file mode 100644
index 000000000..cb6f13198
--- /dev/null
+++ b/packages/website/public/css/basscss.min.css
@@ -0,0 +1 @@
+/*! Basscss | http://basscss.com | MIT License */.h1{font-size:2rem}.h2{font-size:1.5rem}.h3{font-size:1.25rem}.h4{font-size:1rem}.h5{font-size:.875rem}.h6{font-size:.75rem}.font-family-inherit{font-family:inherit}.font-size-inherit{font-size:inherit}.text-decoration-none{text-decoration:none}.bold{font-weight:700}.regular{font-weight:400}.italic{font-style:italic}.caps{text-transform:uppercase;letter-spacing:.2em}.left-align{text-align:left}.center{text-align:center}.right-align{text-align:right}.justify{text-align:justify}.nowrap{white-space:nowrap}.break-word{word-wrap:break-word}.line-height-1{line-height:1}.line-height-2{line-height:1.125}.line-height-3{line-height:1.25}.line-height-4{line-height:1.5}.list-style-none{list-style:none}.underline{text-decoration:underline}.truncate{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.list-reset{list-style:none;padding-left:0}.inline{display:inline}.block{display:block}.inline-block{display:inline-block}.table{display:table}.table-cell{display:table-cell}.overflow-hidden{overflow:hidden}.overflow-scroll{overflow:scroll}.overflow-auto{overflow:auto}.clearfix:after,.clearfix:before{content:" ";display:table}.clearfix:after{clear:both}.left{float:left}.right{float:right}.fit{max-width:100%}.max-width-1{max-width:24rem}.max-width-2{max-width:32rem}.max-width-3{max-width:48rem}.max-width-4{max-width:64rem}.border-box{box-sizing:border-box}.align-baseline{vertical-align:baseline}.align-top{vertical-align:top}.align-middle{vertical-align:middle}.align-bottom{vertical-align:bottom}.m0{margin:0}.mt0{margin-top:0}.mr0{margin-right:0}.mb0{margin-bottom:0}.ml0,.mx0{margin-left:0}.mx0{margin-right:0}.my0{margin-top:0;margin-bottom:0}.m1{margin:.5rem}.mt1{margin-top:.5rem}.mr1{margin-right:.5rem}.mb1{margin-bottom:.5rem}.ml1,.mx1{margin-left:.5rem}.mx1{margin-right:.5rem}.my1{margin-top:.5rem;margin-bottom:.5rem}.m2{margin:1rem}.mt2{margin-top:1rem}.mr2{margin-right:1rem}.mb2{margin-bottom:1rem}.ml2,.mx2{margin-left:1rem}.mx2{margin-right:1rem}.my2{margin-top:1rem;margin-bottom:1rem}.m3{margin:2rem}.mt3{margin-top:2rem}.mr3{margin-right:2rem}.mb3{margin-bottom:2rem}.ml3,.mx3{margin-left:2rem}.mx3{margin-right:2rem}.my3{margin-top:2rem;margin-bottom:2rem}.m4{margin:4rem}.mt4{margin-top:4rem}.mr4{margin-right:4rem}.mb4{margin-bottom:4rem}.ml4,.mx4{margin-left:4rem}.mx4{margin-right:4rem}.my4{margin-top:4rem;margin-bottom:4rem}.mxn1{margin-left:-.5rem;margin-right:-.5rem}.mxn2{margin-left:-1rem;margin-right:-1rem}.mxn3{margin-left:-2rem;margin-right:-2rem}.mxn4{margin-left:-4rem;margin-right:-4rem}.ml-auto{margin-left:auto}.mr-auto,.mx-auto{margin-right:auto}.mx-auto{margin-left:auto}.p0{padding:0}.pt0{padding-top:0}.pr0{padding-right:0}.pb0{padding-bottom:0}.pl0,.px0{padding-left:0}.px0{padding-right:0}.py0{padding-top:0;padding-bottom:0}.p1{padding:.5rem}.pt1{padding-top:.5rem}.pr1{padding-right:.5rem}.pb1{padding-bottom:.5rem}.pl1{padding-left:.5rem}.py1{padding-top:.5rem;padding-bottom:.5rem}.px1{padding-left:.5rem;padding-right:.5rem}.p2{padding:1rem}.pt2{padding-top:1rem}.pr2{padding-right:1rem}.pb2{padding-bottom:1rem}.pl2{padding-left:1rem}.py2{padding-top:1rem;padding-bottom:1rem}.px2{padding-left:1rem;padding-right:1rem}.p3{padding:2rem}.pt3{padding-top:2rem}.pr3{padding-right:2rem}.pb3{padding-bottom:2rem}.pl3{padding-left:2rem}.py3{padding-top:2rem;padding-bottom:2rem}.px3{padding-left:2rem;padding-right:2rem}.p4{padding:4rem}.pt4{padding-top:4rem}.pr4{padding-right:4rem}.pb4{padding-bottom:4rem}.pl4{padding-left:4rem}.py4{padding-top:4rem;padding-bottom:4rem}.px4{padding-left:4rem;padding-right:4rem}.col{float:left}.col,.col-right{box-sizing:border-box}.col-right{float:right}.col-1{width:8.33333%}.col-2{width:16.66667%}.col-3{width:25%}.col-4{width:33.33333%}.col-5{width:41.66667%}.col-6{width:50%}.col-7{width:58.33333%}.col-8{width:66.66667%}.col-9{width:75%}.col-10{width:83.33333%}.col-11{width:91.66667%}.col-12{width:100%}@media (min-width:40em){.sm-col{float:left;box-sizing:border-box}.sm-col-right{float:right;box-sizing:border-box}.sm-col-1{width:8.33333%}.sm-col-2{width:16.66667%}.sm-col-3{width:25%}.sm-col-4{width:33.33333%}.sm-col-5{width:41.66667%}.sm-col-6{width:50%}.sm-col-7{width:58.33333%}.sm-col-8{width:66.66667%}.sm-col-9{width:75%}.sm-col-10{width:83.33333%}.sm-col-11{width:91.66667%}.sm-col-12{width:100%}}@media (min-width:52em){.md-col{float:left;box-sizing:border-box}.md-col-right{float:right;box-sizing:border-box}.md-col-1{width:8.33333%}.md-col-2{width:16.66667%}.md-col-3{width:25%}.md-col-4{width:33.33333%}.md-col-5{width:41.66667%}.md-col-6{width:50%}.md-col-7{width:58.33333%}.md-col-8{width:66.66667%}.md-col-9{width:75%}.md-col-10{width:83.33333%}.md-col-11{width:91.66667%}.md-col-12{width:100%}}@media (min-width:64em){.lg-col{float:left;box-sizing:border-box}.lg-col-right{float:right;box-sizing:border-box}.lg-col-1{width:8.33333%}.lg-col-2{width:16.66667%}.lg-col-3{width:25%}.lg-col-4{width:33.33333%}.lg-col-5{width:41.66667%}.lg-col-6{width:50%}.lg-col-7{width:58.33333%}.lg-col-8{width:66.66667%}.lg-col-9{width:75%}.lg-col-10{width:83.33333%}.lg-col-11{width:91.66667%}.lg-col-12{width:100%}}.flex{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}@media (min-width:40em){.sm-flex{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}}@media (min-width:52em){.md-flex{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}}@media (min-width:64em){.lg-flex{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}}.flex-column{-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.flex-wrap{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.items-start{-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;-ms-grid-row-align:flex-start;align-items:flex-start}.items-end{-webkit-box-align:end;-webkit-align-items:flex-end;-ms-flex-align:end;-ms-grid-row-align:flex-end;align-items:flex-end}.items-center{-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;-ms-grid-row-align:center;align-items:center}.items-baseline{-webkit-box-align:baseline;-webkit-align-items:baseline;-ms-flex-align:baseline;-ms-grid-row-align:baseline;align-items:baseline}.items-stretch{-webkit-box-align:stretch;-webkit-align-items:stretch;-ms-flex-align:stretch;-ms-grid-row-align:stretch;align-items:stretch}.self-start{-webkit-align-self:flex-start;-ms-flex-item-align:start;align-self:flex-start}.self-end{-webkit-align-self:flex-end;-ms-flex-item-align:end;align-self:flex-end}.self-center{-webkit-align-self:center;-ms-flex-item-align:center;align-self:center}.self-baseline{-webkit-align-self:baseline;-ms-flex-item-align:baseline;align-self:baseline}.self-stretch{-webkit-align-self:stretch;-ms-flex-item-align:stretch;align-self:stretch}.justify-start{-webkit-box-pack:start;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start}.justify-end{-webkit-box-pack:end;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end}.justify-center{-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center}.justify-between{-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between}.justify-around{-webkit-justify-content:space-around;-ms-flex-pack:distribute;justify-content:space-around}.content-start{-webkit-align-content:flex-start;-ms-flex-line-pack:start;align-content:flex-start}.content-end{-webkit-align-content:flex-end;-ms-flex-line-pack:end;align-content:flex-end}.content-center{-webkit-align-content:center;-ms-flex-line-pack:center;align-content:center}.content-between{-webkit-align-content:space-between;-ms-flex-line-pack:justify;align-content:space-between}.content-around{-webkit-align-content:space-around;-ms-flex-line-pack:distribute;align-content:space-around}.content-stretch{-webkit-align-content:stretch;-ms-flex-line-pack:stretch;align-content:stretch}.flex-auto{-webkit-box-flex:1;-webkit-flex:1 1 auto;-ms-flex:1 1 auto;flex:1 1 auto;min-width:0;min-height:0}.flex-none{-webkit-box-flex:0;-webkit-flex:none;-ms-flex:none;flex:none}.order-0{-webkit-box-ordinal-group:1;-webkit-order:0;-ms-flex-order:0;order:0}.order-1{-webkit-box-ordinal-group:2;-webkit-order:1;-ms-flex-order:1;order:1}.order-2{-webkit-box-ordinal-group:3;-webkit-order:2;-ms-flex-order:2;order:2}.order-3{-webkit-box-ordinal-group:4;-webkit-order:3;-ms-flex-order:3;order:3}.order-last{-webkit-box-ordinal-group:100000;-webkit-order:99999;-ms-flex-order:99999;order:99999}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.top-0{top:0}.right-0{right:0}.bottom-0{bottom:0}.left-0{left:0}.z1{z-index:1}.z2{z-index:2}.z3{z-index:3}.z4{z-index:4}.border{border-style:solid;border-width:1px}.border-top{border-top-style:solid;border-top-width:1px}.border-right{border-right-style:solid;border-right-width:1px}.border-bottom{border-bottom-style:solid;border-bottom-width:1px}.border-left{border-left-style:solid;border-left-width:1px}.border-none{border:0}.rounded{border-radius:3px}.circle{border-radius:50%}.rounded-top{border-radius:3px 3px 0 0}.rounded-right{border-radius:0 3px 3px 0}.rounded-bottom{border-radius:0 0 3px 3px}.rounded-left{border-radius:3px 0 0 3px}.not-rounded{border-radius:0}.hide{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}@media (max-width:40em){.xs-hide{display:none!important}}@media (min-width:40em) and (max-width:52em){.sm-hide{display:none!important}}@media (min-width:52em) and (max-width:64em){.md-hide{display:none!important}}@media (min-width:64em){.lg-hide{display:none!important}}.display-none{display:none!important}
\ No newline at end of file
diff --git a/packages/website/public/index.html b/packages/website/public/index.html
index 26ebcdec8..738b675e7 100644
--- a/packages/website/public/index.html
+++ b/packages/website/public/index.html
@@ -18,6 +18,7 @@
         <link rel="stylesheet" href="/css/roboto.css" />
         <link rel="stylesheet" href="/css/roboto_mono.css" />
         <link rel="stylesheet" href="/css/formular.css" />
+        <link rel="stylesheet" href="/css/basscss.min.css" />
         <link rel="stylesheet" href="/css/basscss_responsive_custom.css" />
         <link rel="stylesheet" href="/css/basscss_responsive_padding.css" />
         <link rel="stylesheet" href="/css/basscss_responsive_margin.css" />
diff --git a/packages/website/ts/components/dialogs/ledger_config_dialog.tsx b/packages/website/ts/components/dialogs/ledger_config_dialog.tsx
index e15a2dd94..527353aa0 100644
--- a/packages/website/ts/components/dialogs/ledger_config_dialog.tsx
+++ b/packages/website/ts/components/dialogs/ledger_config_dialog.tsx
@@ -20,8 +20,8 @@ import { utils } from 'ts/utils/utils';
 const VALID_ETHEREUM_DERIVATION_PATH_PREFIX = `44'/60'`;
 
 enum LedgerSteps {
-    CONNECT,
-    SELECT_ADDRESS,
+    Connect,
+    SelectAddress,
 }
 
 interface LedgerConfigDialogProps {
@@ -52,7 +52,7 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
         const derivationPathIfExists = props.blockchain.getLedgerDerivationPathIfExists();
         this.state = {
             connectionErrMsg: '',
-            stepIndex: LedgerSteps.CONNECT,
+            stepIndex: LedgerSteps.Connect,
             userAddresses: [],
             addressBalances: [],
             derivationPath: _.isUndefined(derivationPathIfExists)
@@ -67,7 +67,7 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
             <FlatButton key="ledgerConnectCancel" label="Cancel" onClick={this._onClose.bind(this)} />,
         ];
         const dialogTitle =
-            this.state.stepIndex === LedgerSteps.CONNECT ? 'Connect to your Ledger' : 'Select desired address';
+            this.state.stepIndex === LedgerSteps.Connect ? 'Connect to your Ledger' : 'Select desired address';
         return (
             <Dialog
                 title={dialogTitle}
@@ -79,8 +79,8 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
                 bodyStyle={{ paddingBottom: 0 }}
             >
                 <div style={{ color: colors.grey700, paddingTop: 1 }}>
-                    {this.state.stepIndex === LedgerSteps.CONNECT && this._renderConnectStep()}
-                    {this.state.stepIndex === LedgerSteps.SELECT_ADDRESS && this._renderSelectAddressStep()}
+                    {this.state.stepIndex === LedgerSteps.Connect && this._renderConnectStep()}
+                    {this.state.stepIndex === LedgerSteps.SelectAddress && this._renderSelectAddressStep()}
                 </div>
             </Dialog>
         );
@@ -195,7 +195,7 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
     private _onClose(): void {
         this.setState({
             connectionErrMsg: '',
-            stepIndex: LedgerSteps.CONNECT,
+            stepIndex: LedgerSteps.Connect,
         });
         const isOpen = false;
         this.props.toggleDialogFn(isOpen);
@@ -210,7 +210,7 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
         this.props.blockchain.fetchTokenInformationAsync();
         this.props.dispatcher.updateUserWeiBalance(selectAddressBalance);
         this.setState({
-            stepIndex: LedgerSteps.CONNECT,
+            stepIndex: LedgerSteps.Connect,
         });
         const isOpen = false;
         this.props.toggleDialogFn(isOpen);
@@ -284,7 +284,7 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
         const didSucceed = await this._fetchAddressesAndBalancesAsync();
         if (didSucceed) {
             this.setState({
-                stepIndex: LedgerSteps.SELECT_ADDRESS,
+                stepIndex: LedgerSteps.SelectAddress,
                 connectionErrMsg: '',
             });
         }
diff --git a/packages/website/ts/components/fill_order.tsx b/packages/website/ts/components/fill_order.tsx
index 2fa2b94a0..7fee8c4df 100644
--- a/packages/website/ts/components/fill_order.tsx
+++ b/packages/website/ts/components/fill_order.tsx
@@ -182,7 +182,7 @@ export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
                     </div>
                 )}
                 {!_.isEmpty(this.state.orderJSONErrMsg) && (
-                    <Alert type={AlertTypes.ERROR} message={this.state.orderJSONErrMsg} />
+                    <Alert type={AlertTypes.Error} message={this.state.orderJSONErrMsg} />
                 )}
             </div>
         );
@@ -298,7 +298,7 @@ export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
                                 onClick={this._onCancelOrderClickFireAndForgetAsync.bind(this)}
                             />
                             {this.state.didCancelOrderSucceed && (
-                                <Alert type={AlertTypes.SUCCESS} message={this._renderCancelSuccessMsg()} />
+                                <Alert type={AlertTypes.Success} message={this._renderCancelSuccessMsg()} />
                             )}
                         </div>
                     ) : (
@@ -310,10 +310,10 @@ export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
                                 onClick={this._onFillOrderClick.bind(this)}
                             />
                             {!_.isEmpty(this.state.globalErrMsg) && (
-                                <Alert type={AlertTypes.ERROR} message={this.state.globalErrMsg} />
+                                <Alert type={AlertTypes.Error} message={this.state.globalErrMsg} />
                             )}
                             {this.state.didFillOrderSucceed && (
-                                <Alert type={AlertTypes.SUCCESS} message={this._renderFillSuccessMsg()} />
+                                <Alert type={AlertTypes.Success} message={this._renderFillSuccessMsg()} />
                             )}
                         </div>
                     )}
diff --git a/packages/website/ts/components/generate_order/asset_picker.tsx b/packages/website/ts/components/generate_order/asset_picker.tsx
index e6ecd2ec8..d3f11f962 100644
--- a/packages/website/ts/components/generate_order/asset_picker.tsx
+++ b/packages/website/ts/components/generate_order/asset_picker.tsx
@@ -18,9 +18,9 @@ import { utils } from 'ts/utils/utils';
 const TOKEN_ICON_DIMENSION = 100;
 const TILE_DIMENSION = 146;
 enum AssetViews {
-    ASSET_PICKER = 'ASSET_PICKER',
-    NEW_TOKEN_FORM = 'NEW_TOKEN_FORM',
-    CONFIRM_TRACK_TOKEN = 'CONFIRM_TRACK_TOKEN',
+    AssetPicker = 'ASSET_PICKER',
+    NewTokenForm = 'NEW_TOKEN_FORM',
+    ConfirmTrackToken = 'CONFIRM_TRACK_TOKEN',
 }
 
 interface AssetPickerProps {
@@ -44,29 +44,29 @@ interface AssetPickerState {
 
 export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerState> {
     public static defaultProps: Partial<AssetPickerProps> = {
-        tokenVisibility: TokenVisibility.ALL,
+        tokenVisibility: TokenVisibility.All,
     };
     private readonly _dialogConfigsByAssetView: { [assetView: string]: DialogConfigs };
     constructor(props: AssetPickerProps) {
         super(props);
         this.state = {
-            assetView: AssetViews.ASSET_PICKER,
+            assetView: AssetViews.AssetPicker,
             hoveredAddress: undefined,
             chosenTrackTokenAddress: undefined,
             isAddingTokenToTracked: false,
         };
         this._dialogConfigsByAssetView = {
-            [AssetViews.ASSET_PICKER]: {
+            [AssetViews.AssetPicker]: {
                 title: 'Select token',
                 isModal: false,
                 actions: [],
             },
-            [AssetViews.NEW_TOKEN_FORM]: {
+            [AssetViews.NewTokenForm]: {
                 title: 'Add an ERC20 token',
                 isModal: false,
                 actions: [],
             },
-            [AssetViews.CONFIRM_TRACK_TOKEN]: {
+            [AssetViews.ConfirmTrackToken]: {
                 title: 'Tracking confirmation',
                 isModal: true,
                 actions: [
@@ -95,15 +95,15 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
                 autoScrollBodyContent={true}
                 onRequestClose={this._onCloseDialog.bind(this)}
             >
-                {this.state.assetView === AssetViews.ASSET_PICKER && this._renderAssetPicker()}
-                {this.state.assetView === AssetViews.NEW_TOKEN_FORM && (
+                {this.state.assetView === AssetViews.AssetPicker && this._renderAssetPicker()}
+                {this.state.assetView === AssetViews.NewTokenForm && (
                     <NewTokenForm
                         blockchain={this.props.blockchain}
                         onNewTokenSubmitted={this._onNewTokenSubmitted.bind(this)}
                         tokenByAddress={this.props.tokenByAddress}
                     />
                 )}
-                {this.state.assetView === AssetViews.CONFIRM_TRACK_TOKEN && this._renderConfirmTrackToken()}
+                {this.state.assetView === AssetViews.ConfirmTrackToken && this._renderConfirmTrackToken()}
             </Dialog>
         );
     }
@@ -138,19 +138,19 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
         const allTokens = _.values(this.props.tokenByAddress);
         // filter tokens based on visibility specified in props, do not show ZRX or ETHER as tracked or untracked
         const filteredTokens =
-            this.props.tokenVisibility === TokenVisibility.ALL
+            this.props.tokenVisibility === TokenVisibility.All
                 ? allTokens
                 : _.filter(allTokens, token => {
                       return (
                           token.symbol !== constants.ZRX_TOKEN_SYMBOL &&
                           token.symbol !== constants.ETHER_TOKEN_SYMBOL &&
-                          ((this.props.tokenVisibility === TokenVisibility.TRACKED && utils.isTokenTracked(token)) ||
-                              (this.props.tokenVisibility === TokenVisibility.UNTRACKED &&
+                          ((this.props.tokenVisibility === TokenVisibility.Tracked && utils.isTokenTracked(token)) ||
+                              (this.props.tokenVisibility === TokenVisibility.Untracked &&
                                   !utils.isTokenTracked(token)))
                       );
                   });
         // if we are showing tracked tokens, sort by date added, otherwise sort by symbol
-        const sortKey = this.props.tokenVisibility === TokenVisibility.TRACKED ? 'trackedTimestamp' : 'symbol';
+        const sortKey = this.props.tokenVisibility === TokenVisibility.Tracked ? 'trackedTimestamp' : 'symbol';
         const sortedTokens = filteredTokens.sort(firstBy(sortKey));
         if (_.isEmpty(sortedTokens)) {
             return <div className="mx-auto p4 h2">No tokens to remove.</div>;
@@ -188,7 +188,7 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
             cursor: 'pointer',
             opacity: isHovered ? 0.6 : 1,
         };
-        if (this.props.tokenVisibility !== TokenVisibility.TRACKED) {
+        if (this.props.tokenVisibility !== TokenVisibility.Tracked) {
             gridTiles.push(
                 <div
                     key={otherTokenKey}
@@ -222,7 +222,7 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
     }
     private _onCloseDialog(): void {
         this.setState({
-            assetView: AssetViews.ASSET_PICKER,
+            assetView: AssetViews.AssetPicker,
         });
         this.props.onTokenChosen(this.props.currentTokenAddress);
     }
@@ -232,21 +232,21 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
             this.props.onTokenChosen(tokenAddress);
         } else {
             this.setState({
-                assetView: AssetViews.CONFIRM_TRACK_TOKEN,
+                assetView: AssetViews.ConfirmTrackToken,
                 chosenTrackTokenAddress: tokenAddress,
             });
         }
     }
     private _onCustomAssetChosen(): void {
         this.setState({
-            assetView: AssetViews.NEW_TOKEN_FORM,
+            assetView: AssetViews.NewTokenForm,
         });
     }
     private _onNewTokenSubmitted(newToken: Token): void {
         trackedTokenStorage.addTrackedTokenToUser(this.props.userAddress, this.props.networkId, newToken);
         this.props.dispatcher.addTokenToTokenByAddress(newToken);
         this.setState({
-            assetView: AssetViews.ASSET_PICKER,
+            assetView: AssetViews.AssetPicker,
         });
         this.props.onTokenChosen(newToken.address);
     }
@@ -254,7 +254,7 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
         const resetState: AssetPickerState = {
             ...this.state,
             isAddingTokenToTracked: false,
-            assetView: AssetViews.ASSET_PICKER,
+            assetView: AssetViews.AssetPicker,
             chosenTrackTokenAddress: undefined,
         };
         if (!didUserAcceptTracking) {
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 8afbee977..0f70aa18f 100644
--- a/packages/website/ts/components/generate_order/generate_order_form.tsx
+++ b/packages/website/ts/components/generate_order/generate_order_form.tsx
@@ -36,9 +36,9 @@ import { errorReporter } from 'ts/utils/error_reporter';
 import { utils } from 'ts/utils/utils';
 
 enum SigningState {
-    UNSIGNED,
-    SIGNING,
-    SIGNED,
+    Unsigned,
+    Signing,
+    Signed,
 }
 
 interface GenerateOrderFormProps {
@@ -76,7 +76,7 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
         this.state = {
             globalErrMsg: '',
             shouldShowIncompleteErrs: false,
-            signingState: SigningState.UNSIGNED,
+            signingState: SigningState.Unsigned,
         };
     }
     public componentDidMount(): void {
@@ -207,7 +207,7 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
                             />
                         </div>
                         {this.state.globalErrMsg !== '' && (
-                            <Alert type={AlertTypes.ERROR} message={this.state.globalErrMsg} />
+                            <Alert type={AlertTypes.Error} message={this.state.globalErrMsg} />
                         )}
                     </div>
                 </div>
@@ -215,7 +215,7 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
                     title="Order JSON"
                     titleStyle={{ fontWeight: 100 }}
                     modal={false}
-                    open={this.state.signingState === SigningState.SIGNED}
+                    open={this.state.signingState === SigningState.Signed}
                     onRequestClose={this._onCloseOrderJSONDialog.bind(this)}
                 >
                     <OrderJSON
@@ -247,7 +247,7 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
         // orderHash will not collide with the previously generated orderHash.
         this.props.dispatcher.updateOrderSalt(generatePseudoRandomSalt());
         this.setState({
-            signingState: SigningState.UNSIGNED,
+            signingState: SigningState.Unsigned,
         });
     }
     private async _onSignClickedAsync(): Promise<boolean> {
@@ -305,13 +305,13 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
     }
     private async _signTransactionAsync(): Promise<PortalOrder | undefined> {
         this.setState({
-            signingState: SigningState.SIGNING,
+            signingState: SigningState.Signing,
         });
         const exchangeAddress = this.props.blockchain.getExchangeContractAddressIfExists();
         if (_.isUndefined(exchangeAddress)) {
             this.props.dispatcher.updateShouldBlockchainErrDialogBeOpen(true);
             this.setState({
-                signingState: SigningState.UNSIGNED,
+                signingState: SigningState.Unsigned,
             });
             return undefined;
         }
@@ -371,7 +371,7 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
             }
         }
         this.setState({
-            signingState: globalErrMsg === '' ? SigningState.SIGNED : SigningState.UNSIGNED,
+            signingState: globalErrMsg === '' ? SigningState.Signed : SigningState.Unsigned,
             globalErrMsg,
         });
         return order;
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 b8cd88b18..ce684d177 100644
--- a/packages/website/ts/components/generate_order/new_token_form.tsx
+++ b/packages/website/ts/components/generate_order/new_token_form.tsx
@@ -93,7 +93,7 @@ export class NewTokenForm extends React.Component<NewTokenFormProps, NewTokenFor
                         onClickAsyncFn={this._onAddNewTokenClickAsync.bind(this)}
                     />
                 </div>
-                {this.state.globalErrMsg !== '' && <Alert type={AlertTypes.ERROR} message={this.state.globalErrMsg} />}
+                {this.state.globalErrMsg !== '' && <Alert type={AlertTypes.Error} message={this.state.globalErrMsg} />}
             </div>
         );
     }
diff --git a/packages/website/ts/components/inputs/allowance_state_toggle.tsx b/packages/website/ts/components/inputs/allowance_state_toggle.tsx
index 5396295d2..3a78d32f3 100644
--- a/packages/website/ts/components/inputs/allowance_state_toggle.tsx
+++ b/packages/website/ts/components/inputs/allowance_state_toggle.tsx
@@ -150,7 +150,7 @@ export class AllowanceStateToggle extends React.Component<AllowanceStateTogglePr
             }
             logUtils.log(`Unexpected error encountered: ${err}`);
             logUtils.log(err.stack);
-            this.props.onErrorOccurred(BalanceErrs.allowanceSettingFailed);
+            this.props.onErrorOccurred(BalanceErrs.AllowanceSettingFailed);
             errorReporter.report(err);
         }
     }
diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx
index 6d7c90573..59cf2db71 100644
--- a/packages/website/ts/components/portal/portal.tsx
+++ b/packages/website/ts/components/portal/portal.tsx
@@ -229,8 +229,8 @@ export class Portal extends React.Component<PortalProps, PortalState> {
         const isAssetPickerDialogOpen = this.state.tokenManagementState !== TokenManagementState.None;
         const tokenVisibility =
             this.state.tokenManagementState === TokenManagementState.Add
-                ? TokenVisibility.UNTRACKED
-                : TokenVisibility.TRACKED;
+                ? TokenVisibility.Untracked
+                : TokenVisibility.Tracked;
         return (
             <Container>
                 <MetaTags title={DOCUMENT_TITLE} description={DOCUMENT_DESCRIPTION} />
diff --git a/packages/website/ts/components/token_balances.tsx b/packages/website/ts/components/token_balances.tsx
index 2ed0229c8..e8f2a6461 100644
--- a/packages/website/ts/components/token_balances.tsx
+++ b/packages/website/ts/components/token_balances.tsx
@@ -303,7 +303,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
                     currentTokenAddress={''}
                     onTokenChosen={this._onAssetTokenPicked.bind(this)}
                     tokenByAddress={this.props.tokenByAddress}
-                    tokenVisibility={this.state.isAddingToken ? TokenVisibility.UNTRACKED : TokenVisibility.TRACKED}
+                    tokenVisibility={this.state.isAddingToken ? TokenVisibility.Untracked : TokenVisibility.Tracked}
                 />
             </div>
         );
@@ -439,7 +439,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
     }
     private _onSendFailed(): void {
         this.setState({
-            errorType: BalanceErrs.sendFailed,
+            errorType: BalanceErrs.SendFailed,
         });
     }
     private _renderAmount(amount: BigNumber, decimals: number): React.ReactNode {
@@ -460,7 +460,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
     }
     private _renderErrorDialogBody(): React.ReactNode {
         switch (this.state.errorType) {
-            case BalanceErrs.incorrectNetworkForFaucet:
+            case BalanceErrs.IncorrectNetworkForFaucet:
                 return (
                     <div>
                         Our faucet can only send test Ether to addresses on testnets. Please make sure you are connected
@@ -468,7 +468,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
                     </div>
                 );
 
-            case BalanceErrs.faucetRequestFailed:
+            case BalanceErrs.FaucetRequestFailed:
                 return (
                     <div>
                         An unexpected error occurred while trying to request test Ether from our faucet. Please refresh
@@ -476,13 +476,13 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
                     </div>
                 );
 
-            case BalanceErrs.faucetQueueIsFull:
+            case BalanceErrs.FaucetQueueIsFull:
                 return <div>Our test Ether faucet queue is full. Please try requesting test Ether again later.</div>;
 
-            case BalanceErrs.mintingFailed:
+            case BalanceErrs.MintingFailed:
                 return <div>Minting your test tokens failed unexpectedly. Please refresh the page and try again.</div>;
 
-            case BalanceErrs.allowanceSettingFailed:
+            case BalanceErrs.AllowanceSettingFailed:
                 return (
                     <div>
                         An unexpected error occurred while trying to set your test token allowance. Please refresh the
@@ -521,7 +521,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
             logUtils.log(`Unexpected error encountered: ${err}`);
             logUtils.log(err.stack);
             this.setState({
-                errorType: BalanceErrs.mintingFailed,
+                errorType: BalanceErrs.MintingFailed,
             });
             errorReporter.report(err);
             return false;
@@ -537,7 +537,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
         // from, we must show user an error message
         if (!utils.isTestNetwork(this.props.blockchain.networkId)) {
             this.setState({
-                errorType: BalanceErrs.incorrectNetworkForFaucet,
+                errorType: BalanceErrs.IncorrectNetworkForFaucet,
             });
             return false;
         }
@@ -553,8 +553,8 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
             logUtils.log(`Unexpected status code: ${response.status} -> ${responseBody}`);
             const errorType =
                 response.status === constants.UNAVAILABLE_STATUS
-                    ? BalanceErrs.faucetQueueIsFull
-                    : BalanceErrs.faucetRequestFailed;
+                    ? BalanceErrs.FaucetQueueIsFull
+                    : BalanceErrs.FaucetRequestFailed;
             this.setState({
                 errorType,
             });
diff --git a/packages/website/ts/components/ui/alert.tsx b/packages/website/ts/components/ui/alert.tsx
index 32e0f1be8..c7a5b9030 100644
--- a/packages/website/ts/components/ui/alert.tsx
+++ b/packages/website/ts/components/ui/alert.tsx
@@ -8,7 +8,7 @@ interface AlertProps {
 }
 
 export const Alert = (props: AlertProps) => {
-    const isAlert = props.type === AlertTypes.ERROR;
+    const isAlert = props.type === AlertTypes.Error;
     const errMsgStyles = {
         background: isAlert ? colors.red200 : colors.lightestGreen,
         color: colors.white,
diff --git a/packages/website/ts/components/ui/lifecycle_raised_button.tsx b/packages/website/ts/components/ui/lifecycle_raised_button.tsx
index a8daf4102..f004dd47f 100644
--- a/packages/website/ts/components/ui/lifecycle_raised_button.tsx
+++ b/packages/website/ts/components/ui/lifecycle_raised_button.tsx
@@ -6,9 +6,9 @@ import * as React from 'react';
 const COMPLETE_STATE_SHOW_LENGTH_MS = 2000;
 
 enum ButtonState {
-    READY,
-    LOADING,
-    COMPLETE,
+    Ready,
+    Loading,
+    Complete,
 }
 
 interface LifeCycleRaisedButtonProps {
@@ -38,7 +38,7 @@ export class LifeCycleRaisedButton extends React.Component<LifeCycleRaisedButton
     constructor(props: LifeCycleRaisedButtonProps) {
         super(props);
         this.state = {
-            buttonState: ButtonState.READY,
+            buttonState: ButtonState.Ready,
         };
     }
     public componentWillUnmount(): void {
@@ -52,13 +52,13 @@ export class LifeCycleRaisedButton extends React.Component<LifeCycleRaisedButton
 
         let label;
         switch (this.state.buttonState) {
-            case ButtonState.READY:
+            case ButtonState.Ready:
                 label = this.props.labelReady;
                 break;
-            case ButtonState.LOADING:
+            case ButtonState.Loading:
                 label = this.props.labelLoading;
                 break;
-            case ButtonState.COMPLETE:
+            case ButtonState.Complete:
                 label = this.props.labelComplete;
                 break;
             default:
@@ -72,13 +72,13 @@ export class LifeCycleRaisedButton extends React.Component<LifeCycleRaisedButton
                 backgroundColor={this.props.backgroundColor}
                 labelColor={this.props.labelColor}
                 onClick={this.onClickAsync.bind(this)}
-                disabled={this.props.isDisabled || this.state.buttonState !== ButtonState.READY}
+                disabled={this.props.isDisabled || this.state.buttonState !== ButtonState.Ready}
             />
         );
     }
     public async onClickAsync(): Promise<void> {
         this.setState({
-            buttonState: ButtonState.LOADING,
+            buttonState: ButtonState.Loading,
         });
         const didSucceed = await this.props.onClickAsyncFn();
         if (this._didUnmount) {
@@ -86,16 +86,16 @@ export class LifeCycleRaisedButton extends React.Component<LifeCycleRaisedButton
         }
         if (didSucceed) {
             this.setState({
-                buttonState: ButtonState.COMPLETE,
+                buttonState: ButtonState.Complete,
             });
             this._buttonTimeoutId = window.setTimeout(() => {
                 this.setState({
-                    buttonState: ButtonState.READY,
+                    buttonState: ButtonState.Ready,
                 });
             }, COMPLETE_STATE_SHOW_LENGTH_MS);
         } else {
             this.setState({
-                buttonState: ButtonState.READY,
+                buttonState: ButtonState.Ready,
             });
         }
     }
diff --git a/packages/website/ts/index.tsx b/packages/website/ts/index.tsx
index 4ed66c572..7bb018d17 100644
--- a/packages/website/ts/index.tsx
+++ b/packages/website/ts/index.tsx
@@ -31,7 +31,6 @@ import { NextWhy } from 'ts/pages/why';
 tradeHistoryStorage.clearIfRequired();
 trackedTokenStorage.clearIfRequired();
 
-import 'basscss/css/basscss.css';
 import 'less/all.less';
 
 // We pass modulePromise returning lambda instead of module promise,
diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts
index 50114e2d6..9492da5a5 100644
--- a/packages/website/ts/types.ts
+++ b/packages/website/ts/types.ts
@@ -83,12 +83,12 @@ export interface Fill {
 }
 
 export enum BalanceErrs {
-    incorrectNetworkForFaucet,
-    faucetRequestFailed,
-    faucetQueueIsFull,
-    mintingFailed,
-    sendFailed,
-    allowanceSettingFailed,
+    IncorrectNetworkForFaucet,
+    FaucetRequestFailed,
+    FaucetQueueIsFull,
+    MintingFailed,
+    SendFailed,
+    AllowanceSettingFailed,
 }
 
 export enum ActionTypes {
@@ -209,8 +209,8 @@ export enum ScreenWidths {
 }
 
 export enum AlertTypes {
-    ERROR,
-    SUCCESS,
+    Error,
+    Success,
 }
 
 export enum BlockchainErrs {
@@ -228,11 +228,11 @@ export enum BlockchainCallErrs {
 }
 
 export enum Environments {
-    DEVELOPMENT = 'DEVELOPMENT',
-    DOGFOOD = 'DOGFOOD',
-    STAGING = 'STAGING',
-    PRODUCTION = 'PRODUCTION',
-    UNKNOWN = 'UNKNOWN',
+    Development = 'DEVELOPMENT',
+    Dogfood = 'DOGFOOD',
+    Staging = 'STAGING',
+    Production = 'PRODUCTION',
+    Unknown = 'UNKNOWN',
 }
 
 export type ContractInstance = any; // TODO: add type definition for Contract
@@ -323,9 +323,9 @@ export interface DialogConfigs {
 }
 
 export enum TokenVisibility {
-    ALL = 'ALL',
-    UNTRACKED = 'UNTRACKED',
-    TRACKED = 'TRACKED',
+    All = 'ALL',
+    Untracked = 'UNTRACKED',
+    Tracked = 'TRACKED',
 }
 
 export interface VersionToFilePath {
@@ -350,7 +350,7 @@ export enum WebsitePaths {
     Docs = '/docs',
     ZeroExJs = '/docs/0x.js',
     Home = '/',
-    FAQ = '/faq',
+    FAQ = '/faq', // tslint:disable-line:enum-naming
     About = '/about',
     AboutMission = '/about/mission',
     AboutTeam = '/about/team',
@@ -629,7 +629,7 @@ export enum BrowserType {
 
 export enum OperatingSystemType {
     Android = 'Android',
-    iOS = 'iOS',
+    iOS = 'iOS', // tslint:disable-line:enum-naming
     Mac = 'Mac',
     Windows = 'Windows',
     WindowsPhone = 'WindowsPhone',
diff --git a/packages/website/ts/utils/utils.ts b/packages/website/ts/utils/utils.ts
index 8cc0061de..890f1553a 100644
--- a/packages/website/ts/utils/utils.ts
+++ b/packages/website/ts/utils/utils.ts
@@ -342,18 +342,18 @@ export const utils = {
     },
     getEnvironment(): Environments {
         if (utils.isDogfood()) {
-            return Environments.DOGFOOD;
+            return Environments.Dogfood;
         }
         if (utils.isDevelopment()) {
-            return Environments.DEVELOPMENT;
+            return Environments.Development;
         }
         if (utils.isStaging()) {
-            return Environments.STAGING;
+            return Environments.Staging;
         }
         if (utils.isProduction()) {
-            return Environments.PRODUCTION;
+            return Environments.Production;
         }
-        return Environments.UNKNOWN;
+        return Environments.Unknown;
     },
     getEthToken(tokenByAddress: TokenByAddress): Token {
         return utils.getTokenBySymbol(constants.ETHER_TOKEN_SYMBOL, tokenByAddress);