feat(App): Lay groundwork for general themeing support

3 files changed, 56 insertions, 0 deletions

diff --git a/src/theme/dark/index.js b/src/theme/dark/index.js
new file mode 100644
index 000000000..e0e017c7c
--- /dev/null
+++ b/src/theme/dark/index.js
@@ -0,0 +1,5 @@
+import * as legacyStyles from '../default/legacy';
+
+export const colorBackground = legacyStyles.darkThemeGrayDarkest;
+
+export const colorHeadline = legacyStyles.darkThemeTextColor;
diff --git a/src/theme/default/index.js b/src/theme/default/index.js
new file mode 100644
index 000000000..f8b6e898d
--- /dev/null
+++ b/src/theme/default/index.js
@@ -0,0 +1,12 @@
+import * as legacyStyles from './legacy';
+
+/* legacy config, injected into sass */
+export const themeBrandPrimary = '#3498db';
+export const themeBrandSuccess = '#5cb85c';
+export const themeBrandInfo = '#5bc0de';
+export const themeBrandWarning = '#FF9F00';
+export const themeBrandDanger = '#d9534f';
+
+export const colorBackground = legacyStyles.themeGrayLighter;
+
+export const colorHeadline = legacyStyles.themeGrayDark;
diff --git a/src/theme/default/legacy.js b/src/theme/default/legacy.js
new file mode 100644
index 000000000..b676dc1d9
--- /dev/null
+++ b/src/theme/default/legacy.js
@@ -0,0 +1,39 @@
+/* legacy config, injected into sass */
+export const themeBrandPrimary = '#3498db';
+export const themeBrandSuccess = '#5cb85c';
+export const themeBrandInfo = '#5bc0de';
+export const themeBrandWarning = '#FF9F00';
+export const themeBrandDanger = '#d9534f';
+
+export const themeGrayDark = '#373a3c';
+export const themeGray = '#55595c';
+export const themeGrayLight = '#818a91';
+export const themeGrayLighter = '#eceeef';
+export const themeGrayLightest = '#f7f7f9';
+
+export const themeBorderRadius = '6px';
+export const themeBorderRadiusSmall = '3px';
+
+export const themeSidebarWidth = '68px';
+
+export const themeTextColor = themeGrayDark;
+
+export const themeTransitionTime = '.5s';
+
+export const themeInsetShadow = 'inset 0 2px 5px rgba(0, 0, 0, .03)';
+
+
+export const darkThemeBlack = '#1A1A1A';
+
+export const darkThemeGrayDarkest = '#1E1E1E';
+export const darkThemeGrayDarker = '#2D2F31';
+export const darkThemeGrayDark = '#383A3B';
+
+export const darkThemeGray = '#47494B';
+
+export const darkThemeGrayLight = '#515355';
+export const darkThemeGrayLighter = '#8a8b8b';
+export const darkThemeGrayLightest = '#FFFFFF';
+
+export const darkThemeGraySmoke = '#CED0D1';
+export const darkThemeTextColor = '#FFFFFF';