-
Notifications
You must be signed in to change notification settings - Fork 0
/
theme.ts
42 lines (39 loc) · 1.2 KB
/
theme.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
/*
WARNING. These colors are used in useTheme hook and are duplicated in _document.tsx as well.
*/
export type ThemeType = {
type: 'LIGHT' | 'DARK'
primaryColor: string // mostly background
secondaryColor: string // mostly text color
accentColor: string // button colors, heading underline colors, icon colors
greyColor: string // helper texts, etc.
dangerColor: string // error texts, i.e in TextField or incorrect quiz question
successColor: string // i.e correct quiz question
footerBackgroundColor: string
shadowColor: string
courseInfoIconColor: string
}
export const lightTheme: ThemeType = {
type: 'LIGHT',
primaryColor: 'white',
secondaryColor: '#212121',
accentColor: '#7E50E6',
greyColor: '#545454',
dangerColor: '#CB2041',
successColor: '#4CBF6B',
footerBackgroundColor: '#212121',
shadowColor: 'rgba(0,0,0,0.2)',
courseInfoIconColor: '#58595B',
}
export const darkTheme: ThemeType = {
type: 'DARK',
primaryColor: '#212121',
secondaryColor: '#efefef',
accentColor: '#7E50E6',
greyColor: '#545454',
dangerColor: '#CB2041',
successColor: '#4CBF6B',
footerBackgroundColor: '#efefef',
shadowColor: 'rgba(255,255,255,0.2)',
courseInfoIconColor: '#BCBEC0',
}