Move muiTheme into it's own module

2 files changed, 37 insertions, 35 deletions

diff --git a/packages/website/ts/index.tsx b/packages/website/ts/index.tsx
index 2f88ec8f4..685ce4962 100644
--- a/packages/website/ts/index.tsx
+++ b/packages/website/ts/index.tsx
@@ -2,7 +2,7 @@
 import 'whatwg-fetch';
 
 import {bigNumberConfigs} from '@0xproject/utils';
-import {getMuiTheme, MuiThemeProvider} from 'material-ui/styles';
+import {MuiThemeProvider} from 'material-ui/styles';
 import * as React from 'react';
 import {render} from 'react-dom';
 import {Provider} from 'react-redux';
@@ -19,7 +19,7 @@ import {NotFound} from 'ts/pages/not_found';
 import {Wiki} from 'ts/pages/wiki/wiki';
 import {reducer, State} from 'ts/redux/reducer';
 import {WebsitePaths} from 'ts/types';
-import {colors} from 'ts/utils/colors';
+import {muiTheme} from 'ts/utils/mui_theme';
 injectTapEventPlugin();
 
 bigNumberConfigs.configure();
@@ -31,39 +31,6 @@ trackedTokenStorage.clearIfRequired();
 import 'basscss/css/basscss.css';
 import 'less/all.less';
 
-const muiTheme = getMuiTheme({
-    appBar: {
-        height: 45,
-        color: colors.white,
-        textColor: colors.black,
-    },
-    palette: {
-        pickerHeaderColor: colors.lightBlue,
-        primary1Color: colors.lightBlue,
-        primary2Color: colors.lightBlue,
-        textColor: colors.grey700,
-    },
-    datePicker: {
-        color: colors.grey700,
-        textColor: colors.white,
-        calendarTextColor: colors.white,
-        selectColor: colors.darkestGrey,
-        selectTextColor: colors.white,
-    },
-    timePicker: {
-        color: colors.grey700,
-        textColor: colors.white,
-        accentColor: colors.white,
-        headerColor: colors.darkestGrey,
-        selectColor: colors.darkestGrey,
-        selectTextColor: colors.darkestGrey,
-    },
-    toggle: {
-        thumbOnColor: colors.limeGreen,
-        trackOnColor: colors.lightGreen,
-    },
-});
-
 // We pass modulePromise returning lambda instead of module promise,
 // cause we only want to import the module when the user navigates to the page.
 // At the same time webpack statically parses for System.import() to determine bundle chunk split points
diff --git a/packages/website/ts/utils/mui_theme.ts b/packages/website/ts/utils/mui_theme.ts
new file mode 100644
index 000000000..60c58f595
--- /dev/null
+++ b/packages/website/ts/utils/mui_theme.ts
@@ -0,0 +1,35 @@
+import {getMuiTheme} from 'material-ui/styles';
+import {colors} from 'ts/utils/colors';
+
+export const muiTheme = getMuiTheme({
+    appBar: {
+        height: 45,
+        color: colors.white,
+        textColor: colors.black,
+    },
+    palette: {
+        pickerHeaderColor: colors.lightBlue,
+        primary1Color: colors.lightBlue,
+        primary2Color: colors.lightBlue,
+        textColor: colors.grey700,
+    },
+    datePicker: {
+        color: colors.grey700,
+        textColor: colors.white,
+        calendarTextColor: colors.white,
+        selectColor: colors.darkestGrey,
+        selectTextColor: colors.white,
+    },
+    timePicker: {
+        color: colors.grey700,
+        textColor: colors.white,
+        accentColor: colors.white,
+        headerColor: colors.darkestGrey,
+        selectColor: colors.darkestGrey,
+        selectTextColor: colors.darkestGrey,
+    },
+    toggle: {
+        thumbOnColor: colors.limeGreen,
+        trackOnColor: colors.lightGreen,
+    },
+});