aboutsummaryrefslogtreecommitdiffstats
path: root/packages/instant/src/style/theme.ts
diff options
context:
space:
mode:
Diffstat (limited to 'packages/instant/src/style/theme.ts')
-rw-r--r--packages/instant/src/style/theme.ts23
1 files changed, 20 insertions, 3 deletions
diff --git a/packages/instant/src/style/theme.ts b/packages/instant/src/style/theme.ts
index cf9da5378..1e9f55e00 100644
--- a/packages/instant/src/style/theme.ts
+++ b/packages/instant/src/style/theme.ts
@@ -1,6 +1,6 @@
import * as styledComponents from 'styled-components';
-const { default: styled, css, injectGlobal, keyframes, ThemeProvider } = styledComponents;
+const { default: styled, css, keyframes, withTheme, createGlobalStyle, ThemeProvider } = styledComponents;
export type Theme = { [key in ColorOption]: string };
@@ -10,18 +10,35 @@ export enum ColorOption {
lightGrey = 'lightGrey',
grey = 'grey',
feintGrey = 'feintGrey',
+ lightestGrey = 'lightestGrey',
darkGrey = 'darkGrey',
white = 'white',
+ lightOrange = 'lightOrange',
+ darkOrange = 'darkOrange',
+ green = 'green',
+ red = 'red',
}
export const theme: Theme = {
- primaryColor: '#512D80',
+ primaryColor: '#333',
black: 'black',
lightGrey: '#999999',
grey: '#666666',
feintGrey: '#DEDEDE',
+ lightestGrey: '#EEEEEE',
darkGrey: '#333333',
white: 'white',
+ lightOrange: '#F9F2ED',
+ darkOrange: '#F2994C',
+ green: '#3CB34F',
+ red: '#D00000',
};
-export { styled, css, injectGlobal, keyframes, ThemeProvider };
+export const transparentWhite = 'rgba(255,255,255,0.3)';
+export const completelyTransparent = 'rga(0, 0, 0, 0)';
+
+export const generateOverlayBlack = (opacity = 0.6) => {
+ return `rgba(0, 0, 0, ${opacity})`;
+};
+
+export { styled, css, keyframes, withTheme, createGlobalStyle, ThemeProvider };