DanJi-FE/tailwind.config.js at develop · KB-project-14/DanJi-FE · 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
103
/** @type {import('tailwindcss').Config} */
export default {
  content: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'],
  theme: {
    extend: {
      fontFamily: {
        pretendard: ["'Pretendard'", 'sans-serif'],
      },
      colors: {
        White: {
          0: '#ffffff',
          1: '#fdfdfd',
        },
        Yellow: {
          0: '#ffcc00',
          1: '#ffbc00',
        },
        Red: {
          0: '#d44d49',
          1: '#ff0000',
        },
        Brown: {
          0: '#ff6b35',
          1: '#d97706',
          2: '#85714d',
          3: '#60584c',
          4: '#545045',
        },
        Green: {
          0: '#69a06f',
          1: '#059669',
        },
        Blue: {
          0: '#0ea5e9',
        },
        Gray: {
          0: '#f5f6f8',
          1: '#e9ecef',
          2: '#d9d9d9',
          3: '#c7c7c7',
          4: '#9d9d9d',
          5: '#8e8e93',
          6: '#8a8d8f',
          7: '#6c757d',
          8: '#666666',
          9: '#f0f2f5',
          10: '#eeeeee',
        },
        Black: {
          0: '#20222b',
          1: '#1a1a1a',
          2: '#000000',
        },
        Background: {
          DEFAULT: '#F3F4F7',
        },
      },
      keyframes: {
        'fade-in-scale': {
          '0%': { transform: 'scale(0)', opacity: '0' },
          '100%': { transform: 'scale(1)', opacity: '1' },
        },
        'fade-out-scale': {
          '0%': { transform: 'scale(1)', opacity: '1' },
          '100%': { transform: 'scale(0)', opacity: '0' },
        },
      },
      animation: {
        'fade-in-scale': 'fade-in-scale 0.25s ease-out forwards',
        'fade-out-scale': 'fade-out-scale 0.25s ease-in forwards',
      },
      height: {
        'screen-mobile': ['100vh', '100dvh'],
        'screen-dynamic': 'calc(var(--vh, 1vh) * 100)',
      },
      touchAction: {
        manipulation: 'manipulation',
      },
    },
  },
  plugins: [
    require('tailwind-scrollbar-hide'),
    function ({ addBase }) {
      addBase({
        '*': {
          'scrollbar-width': 'none',
          '-ms-overflow-style': 'none',
        },
        '*::-webkit-scrollbar': {
          display: 'none',
        },
      })
    },
    function ({ addUtilities, theme }) {
      const newUtilities = {
        '.touch-manipulation': {
          'touch-action': 'manipulation',
        },
      }
      addUtilities(newUtilities, ['responsive'])
    },
  ],
}