-
Notifications
You must be signed in to change notification settings - Fork 1
/
baseStyles.ts
42 lines (34 loc) · 899 Bytes
/
baseStyles.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
import { ColorManipulationTypes, manipulateColor } from '../../utils'
import { dassanaBlues, dassanaGrays } from './colors'
import { Theme, themes, ThemesType } from './themes'
export const generateBaseStyles = ({ background, primary, text }: Theme) => {
const base = {
bgColor: background,
borderColor: dassanaGrays[6],
color: text.primary
}
const disabled = {
bgColor: dassanaGrays[3],
color: text.disabled
}
const hover = {
borderColor: dassanaBlues[5]
}
const focus = {
...hover,
boxShadow: `0px 0px 4px ${manipulateColor(
primary,
50,
ColorManipulationTypes.fade
)}`
}
const placeholder = {
color: text.disabled
}
return { base, disabled, focus, hover, placeholder }
}
const { dark, light } = ThemesType
export const generalColors = {
[ThemesType.dark]: generateBaseStyles(themes[dark]),
[ThemesType.light]: generateBaseStyles(themes[light])
}