aboutsummaryrefslogtreecommitdiffstats
path: root/packages/theme/src/themes/dark/index.ts
diff options
context:
space:
mode:
Diffstat (limited to 'packages/theme/src/themes/dark/index.ts')
-rw-r--r--packages/theme/src/themes/dark/index.ts30
1 files changed, 23 insertions, 7 deletions
diff --git a/packages/theme/src/themes/dark/index.ts b/packages/theme/src/themes/dark/index.ts
index c8ad78829..7d7bab399 100644
--- a/packages/theme/src/themes/dark/index.ts
+++ b/packages/theme/src/themes/dark/index.ts
@@ -18,7 +18,9 @@ export default (brandPrimary: string) => {
18 const inputColor = legacyStyles.darkThemeGrayLightest; 18 const inputColor = legacyStyles.darkThemeGrayLightest;
19 const inputBackground = legacyStyles.themeGrayDark; 19 const inputBackground = legacyStyles.themeGrayDark;
20 const inputBorder = `1px solid ${legacyStyles.darkThemeGrayLight}`; 20 const inputBorder = `1px solid ${legacyStyles.darkThemeGrayLight}`;
21 const inputPrefixColor = color(legacyStyles.darkThemeGrayLighter).lighten(0.3).hex(); 21 const inputPrefixColor = color(legacyStyles.darkThemeGrayLighter)
22 .lighten(0.3)
23 .hex();
22 const buttonSecondaryTextColor = legacyStyles.darkThemeTextColor; 24 const buttonSecondaryTextColor = legacyStyles.darkThemeTextColor;
23 const selectColor = inputColor; 25 const selectColor = inputColor;
24 const drawerBg = color(colorBackground).lighten(0.3).hex(); 26 const drawerBg = color(colorBackground).lighten(0.3).hex();
@@ -47,7 +49,10 @@ export default (brandPrimary: string) => {
47 49
48 // Loader 50 // Loader
49 colorFullscreenLoaderSpinner: '#FFF', 51 colorFullscreenLoaderSpinner: '#FFF',
50 colorWebviewLoaderBackground: color(legacyStyles.darkThemeGrayDarkest).alpha(0.5).rgb().string(), 52 colorWebviewLoaderBackground: color(legacyStyles.darkThemeGrayDarkest)
53 .alpha(0.5)
54 .rgb()
55 .string(),
51 56
52 // Input 57 // Input
53 labelColor: legacyStyles.darkThemeTextColor, 58 labelColor: legacyStyles.darkThemeTextColor,
@@ -58,8 +63,12 @@ export default (brandPrimary: string) => {
58 inputPrefixBackground: legacyStyles.darkThemeGray, 63 inputPrefixBackground: legacyStyles.darkThemeGray,
59 inputDisabledOpacity: 0.5, 64 inputDisabledOpacity: 0.5,
60 inputScorePasswordBackground: legacyStyles.darkThemeGrayDark, 65 inputScorePasswordBackground: legacyStyles.darkThemeGrayDark,
61 inputModifierColor: color(legacyStyles.darkThemeGrayLighter).lighten(0.3).hex(), 66 inputModifierColor: color(legacyStyles.darkThemeGrayLighter)
62 inputPlaceholderColor: color(legacyStyles.darkThemeGrayLighter).darken(0.1).hex(), 67 .lighten(0.3)
68 .hex(),
69 inputPlaceholderColor: color(legacyStyles.darkThemeGrayLighter)
70 .darken(0.1)
71 .hex(),
63 72
64 // Toggle 73 // Toggle
65 toggleBackground: legacyStyles.darkThemeGray, 74 toggleBackground: legacyStyles.darkThemeGray,
@@ -91,13 +100,20 @@ export default (brandPrimary: string) => {
91 selectToggleColor: inputPrefixColor, 100 selectToggleColor: inputPrefixColor,
92 selectPopupBackground: legacyStyles.darkThemeGrayLight, 101 selectPopupBackground: legacyStyles.darkThemeGrayLight,
93 selectOptionColor: '#FFF', 102 selectOptionColor: '#FFF',
94 selectOptionBorder: `1px solid ${color(legacyStyles.darkThemeGrayLight).darken(0.2).hex()}`, 103 selectOptionBorder: `1px solid ${color(legacyStyles.darkThemeGrayLight)
95 selectOptionItemHover: color(legacyStyles.darkThemeGrayLight).darken(0.2).hex(), 104 .darken(0.2)
105 .hex()}`,
106 selectOptionItemHover: color(legacyStyles.darkThemeGrayLight)
107 .darken(0.2)
108 .hex(),
96 selectOptionItemHoverColor: selectColor, 109 selectOptionItemHoverColor: selectColor,
97 selectSearchColor: inputBackground, 110 selectSearchColor: inputBackground,
98 111
99 // Modal 112 // Modal
100 colorModalOverlayBackground: color(legacyStyles.darkThemeBlack).alpha(0.9).rgb().string(), 113 colorModalOverlayBackground: color(legacyStyles.darkThemeBlack)
114 .alpha(0.9)
115 .rgb()
116 .string(),
101 colorModalBackground: legacyStyles.darkThemeGrayDark, 117 colorModalBackground: legacyStyles.darkThemeGrayDark,
102 118
103 // Services 119 // Services