client/theme.js at main · sisicolcol/client · GitHub

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
68
69
70
71
72
73
74
75
76
77
export const colors = {
  mainBlue: "#0047E4",
  stroke: "#4C83FF",
  pageTextGray1: "#727272",
  smallTextGray2: "#AEAEAE",
  buttonGray3: "#CFCFCF",
  clearInputGray4: "#ECECEC",
  checkButtonGray5: "#E0E0E0",
  chatGray6: "#F8F8F8",
  chatBlue: "#EBF5FF",
};

export const fontSizes = {
  bigButton: 20,
  smallButton: 18,
  bigInfo: 24,
  smallInfo: 16,
  bigText: 22,
  smallText: 18,
};

export const shadowView = {
  width: "90%",
  borderRadius: 10,
  justifyContent: "center",
  alignItems: "center",
  backgroundColor: "white",
  shadowColor: colors.buttonGray3,
  shadowOffset: {
    width: 0,
    height: 2,
  },
  shadowOpacity: 1,
  shadowRadius: 4,
  elevation: 5,
  marginBottom: 10,
};

export const defaultScreen = {
  flex: 1,
  backgroundColor: "white",
  alignItems: "center",
};

export const modalButtonText = {
  fontSize: fontSizes.smallText,
  fontWeight: "500",
  letterSpacing: -0.03,
  paddingBottom: 16,
  textAlign: "center",
};

export const chatStyles = {
  chatBox: {
    wordBreak: "keep-all",
    borderRadius: 12,
    paddingHorizontal: 10,
    paddingVertical: 10,

    maxWidth: "80%",
  },
  myChat: {
    backgroundColor: colors.chatBlue,
    marginLeft: 8,
  },
  partnerChat: {
    backgroundColor: colors.chatGray6,
    marginRight: 8,
  },
  timeBox: { fontSize: 11, letterSpacing: -0.03 },
  myTime: {
    marginLeft: "auto",
  },
  partnerTime: {
    marginRight: "auto",
  },
};