Alpixn-interview-code-review/theme.js at develop · react-rapheal1/Alpixn-interview-code-review · 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
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
module.exports = {
  colors: {
    gray: {
      25: "#FCFCFD",
      50: "#F9FAFB",
      100: "#F2F4F7",
      200: "#EAECF0",
      300: "#D0D5DD",
      400: "#98A2B3",
      500: "#667085",
      600: "#475467",
      700: "#344054",
      800: "#1D2939",
      900: "#101828",
    },
    primary: {
      25: "#F2F7FF",
      50: "#F0F6FF",
      100: "#E6EFFF",
      200: "#B0CDFF",
      300: "#79ABFF",
      400: "#4388FF",
      500: "#0C66FF",
      600: "#004CCC",
      700: "#003999",
      800: "#53389E",
      900: "#42307D",
    },
    secondary: {
      25: "#FFFAF5",
      50: "#FFF7F0",
      100: "#FFF2E6",
      200: "#FFD7B0",
      300: "#FFBB79",
      400: "#FFA043",
      500: "#FF840C",
      600: "#CC6500",
      700: "#994C00",
      800: "#663200",
      900: "#3D1E00",
    },
    error: {
      25: "#FFFBFA",
      50: "#FEF3F2",
      100: "#FEE4E2",
      200: "#FECDCA",
      300: "#FDA29B",
      400: "#F97066",
      500: "#F04438",
      600: "#D92D20",
      700: "#B42318",
      800: "#912018",
      900: "#7A271A",
    },
    warning: {
      25: "#FFFCF5",
      50: "#FFFAEB",
      100: "#FEF0C7",
      200: "#FEDF89",
      300: "#FEC84B",
      400: "#FDB022",
      500: "#F79009",
      600: "#DC6803",
      700: "#B54708",
      800: "#93370D",
      900: "#7A2E0E",
    },
    success: {
      25: "#F6FEF9",
      50: "#ECFDF3",
      100: "#D1FADF",
      200: "#A6F4C5",
      300: "#6CE9A6",
      400: "#32D583",
      500: "#12B76A",
      600: "#039855",
      700: "#027A48",
      800: "#05603A",
      900: "#054F31",
    },

    purple: {
      50: "#F4F3FF",
      700: "#5925DC",
    },

    white: "#FFFFFF",
    black: "#000000",
    orange: "#FF784B",
    amber: "#FFC837",
  },
  boxShadow: {
    gray: {
      100: "0px 1px 2px 0px rgba(16, 24, 40, 0.05)",
    },
    primary: {
      100: "0px 0px 0px 4px #E6EFFF, 0px 1px 2px 0px rgba(16, 24, 40, 0.05);",
    },
  },
};