dev3map-frontend/tailwind.config.js at prod · buzz-space/dev3map-frontend · 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
101
102
const { join } = require('path');

module.exports = {
  content: [
    join(__dirname, './pages/**/*.{js,ts,jsx,tsx}'),
    join(__dirname, './components/**/*.{js,ts,jsx,tsx}'),
    join(__dirname, './layout/**/*.{js,ts,jsx,tsx}'),
    join(__dirname, './containers/**/*.{js,ts,jsx,tsx}'),
  ],
  theme: {
    fontFamily: {
      sans: 'var(--font-sans)',
    },
    extend: {
      backgroundImage: {
        watchlist_performance: "url('./imgs/skeleton_trader.png')",
      },
      backgroundColor: {
        primary: 'var(--primary-color)',
        secondary: 'var(--secondary-color)',
      },
      colors: {
        primary: 'var(--primary-color)',
        secondary: 'var(--secondary-color)',
        grayText: 'var(--text-gray)',
        darkGray: 'var(--dark-gray)',
        primary_01: '#FDFDFD',
        primary_02: '#E5FEDE',
        primary_03: '#D3FDCD',
        primary_04: '#C2FBC0',
        primary_05: '#ABFAAF',
        primary_06: '#7DD789',
        primary_07: '#56B36B',
        primary_08: '#369053',
        primary_09: '#207744',
        neutral_01: '#FFFFFF',
        neutral_02: '#F9F9F9',
        neutral_03: '#F5F5F5',
        neutral_04: '#DEDEDE',
        neutral_05: '#BBBBBB',
        neutral_06: '#646369',
        neutral_07: '#3F3D41',
        neutral_08: '#272529',
        neutral_09: '#1F1D22',
        neutral_100: '#FDE9EE',
        neutral_200: '#FCDDE4',
        neutral_300: '#FAB5C6',
        neutral_400: '#FC6E90',
        neutral_500: '#FF507A',
        neutral_600: '#EE3C6A',
        neutral_700: '#D52A5A',
        neutral_800: '#AA0E3F',
        neutral_900: '#800029',
        success_01: '#D0FDD8',
        success_02: '#73F4A4',
        success_03: '#1ADB8A',
        error_01: '#FDE2D3',
        error_02: '#F6917B',
        error_03: '#F64C4C',
        highlight_01: '#FEFDD5',
        highlight_02: '#FBF681',
        highlight_03: '#FFDE72',
      },
      fontSize: {
        size_12: '12px',
        size_14: '14px',
        size_16: '16px',
        size_20: '20px',
        size_24: '24px',
        size_32: '32px',
        size_36: '36px',
        size_40: '40px',
        size_48: '48px',
      },
      borderRadius: {
        corner_0: '0px',
        corner_16: '16px',
        corner_24: '24px',
        corner_32: '32px',
        corner_40: '40px',
        corner_48: '48px',
      },
      boxShadow: {
        base: '0px 2px 10px var(--box-shadow)',
        second: '0px 2px 10px var(--box-shadow-2)',
      },
      flex: {
        '1/2': '0 0 calc(50% - 10px)',
        '1/3': '0 0 calc(33.333% - 10px)',
      },
      maxWidth: {
        'screen-xl': '1360px',
      },
      screens: {
        xs: { min: '450px' },
      },
    },
  },
  plugins: [
    require('@tailwindcss/line-clamp'),
  ],
};