Add styled-components and polished

3 files changed, 39 insertions, 0 deletions

diff --git a/packages/website/ts/style/colors.ts b/packages/website/ts/style/colors.ts
new file mode 100644
index 000000000..5ffdd6ba7
--- /dev/null
+++ b/packages/website/ts/style/colors.ts
@@ -0,0 +1,19 @@
+import { colors as sharedColors } from '@0xproject/react-shared';
+
+const appColors = {
+    walletBoxShadow: 'rgba(56, 59, 137, 0.2)',
+    walletBorder: '#ededee',
+    walletDefaultItemBackground: '#fbfbfc',
+    walletFocusedItemBackground: '#f0f1f4',
+    allowanceToggleShadow: 'rgba(0, 0, 0, 0)',
+    allowanceToggleOffTrack: '#adadad',
+    allowanceToggleOnTrack: sharedColors.mediumBlue,
+    wrapEtherConfirmationButton: sharedColors.mediumBlue,
+    drawerMenuBackground: '#4a4a4a',
+    menuItemDefaultSelectedBackground: '#424242',
+};
+
+export const colors = {
+    ...sharedColors,
+    ...appColors,
+};
diff --git a/packages/website/ts/style/theme.ts b/packages/website/ts/style/theme.ts
new file mode 100644
index 000000000..9e447e7ee
--- /dev/null
+++ b/packages/website/ts/style/theme.ts
@@ -0,0 +1,15 @@
+import * as styledComponents from 'styled-components';
+
+const {
+    default: styled,
+    css,
+    injectGlobal,
+    keyframes,
+    ThemeProvider,
+} = styledComponents as styledComponents.ThemedStyledComponentsModule<IThemeInterface>;
+
+export interface IThemeInterface {}
+
+export const theme = {};
+
+export { styled, css, injectGlobal, keyframes, ThemeProvider };
diff --git a/packages/website/ts/style/z_index.ts b/packages/website/ts/style/z_index.ts
new file mode 100644
index 000000000..0411cdd91
--- /dev/null
+++ b/packages/website/ts/style/z_index.ts
@@ -0,0 +1,5 @@
+export const zIndex = {
+    topBar: 1100,
+    overlay: 1105,
+    aboveOverlay: 1106,
+};