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
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
|
import { colors as materialUiColors } from 'material-ui/styles';
const baseColors = {
gray40: '#F8F8F8',
grey50: '#FAFAFA',
grey100: '#F5F5F5',
lightestGrey: '#F0F0F0',
greyishPink: '#E6E5E5',
grey300: '#E0E0E0',
beigeWhite: '#E4E4E4',
grey350: '#cacaca',
grey400: '#BDBDBD',
lightGrey: '#BBBBBB',
grey500: '#9E9E9E',
grey: '#A5A5A5',
darkGrey: '#818181',
landingLinkGrey: '#919191',
grey700: '#616161',
grey750: '#515151',
grey800: '#424242',
darkerGrey: '#393939',
heroGrey: '#404040',
projectsGrey: '#343333',
darkestGrey: '#272727',
dharmaDarkGrey: '#252525',
lightBlue: '#60A4F4',
lightBlueA700: '#0091EA',
linkBlue: '#1D5CDE',
mediumBlue: '#488AEA',
darkBlue: '#4D5481',
lightTurquois: '#aefcdc',
turquois: '#058789',
lightPurple: '#A81CA6',
purple: '#690596',
red200: '#EF9A9A',
red: '#E91751',
red500: '#F44336',
red600: '#E53935',
limeGreen: '#66DE75',
lightGreen: '#4DC55C',
lightestGreen: '#89C774',
brightGreen: '#00C33E',
green400: '#66BB6A',
green: '#4DA24B',
amber600: '#FFB300',
orange: '#E69D00',
amber800: '#FF8F00',
darkYellow: '#caca03',
};
const appColors = {
// wallet specific colors
walletBoxShadow: 'rgba(56, 59, 137, 0.2)',
walletBorder: '#ededee',
walletDefaultItemBackground: '#fbfbfc',
walletFocusedItemBackground: '#f0f1f4',
allowanceToggleShadow: 'rgba(0, 0, 0, 0)',
allowanceToggleOffTrack: '#adadad',
allowanceToggleOnTrack: baseColors.mediumBlue,
wrapEtherConfirmationButton: baseColors.mediumBlue,
};
export const colors = {
...materialUiColors,
...baseColors,
...appColors,
};
|
